Singapore Expats

CSS Style Sheet Expert?

Discuss about computers & Internet. Including mobile phones, home appliances & other gadgets. Read about Windows security risks or virus updates.
Post Reply
User avatar
Strong Eagle
Moderator
Moderator
Posts: 11507
Joined: Sat, 10 Jul 2004 12:13 am
Location: Off The Red Dot
Contact:

CSS Style Sheet Expert?

Post by Strong Eagle » Mon, 06 May 2013 11:14 pm

Folks, I'm having an issue with a CSS style sheet. I changed the font and now my menus line up OK when on a standard monitor of varying resolutions, but they don't align properly on a iPad or on my mobile phone. Try www.catalystbusinessadvocates.com/methods and /services to see what I mean. Anyone willing to take a quick peek before I step out to hire someone?

Thanks.

User avatar
sundaymorningstaple
Moderator
Moderator
Posts: 40274
Joined: Thu, 11 Nov 2004 1:26 pm
Answers: 12
Location: Retired on the Little Red Dot

Post by sundaymorningstaple » Tue, 07 May 2013 6:55 am

Wah Lao! Good thing you are a moderator! Have to admit, though, it's a pretty good ruse to get eyeballs to your site! :mrgreen:


Sorry, just couldn't help meself! :P Have a good evening SE.
SOME PEOPLE TRY TO TURN BACK THEIR ODOMETERS. NOT ME. I WANT PEOPLE TO KNOW WHY I LOOK THIS WAY. I'VE TRAVELED A LONG WAY, AND SOME OF THE ROADS WEREN'T PAVED. ~ Will Rogers

User avatar
Strong Eagle
Moderator
Moderator
Posts: 11507
Joined: Sat, 10 Jul 2004 12:13 am
Location: Off The Red Dot
Contact:

Post by Strong Eagle » Tue, 07 May 2013 7:48 am

Har, har. I think my new business is one that wouldn't work very well in Singapore. Maybe with a bank as creditor. But suppliers or local private lenders? Piranhas they would be and not interested in negotiating a debt.

Maybe in the future... for now, I'm USA based.

User avatar
Max Headroom
Reporter
Reporter
Posts: 921
Joined: Wed, 08 May 2013 11:31 am
Location: Singapore

Post by Max Headroom » Thu, 09 May 2013 8:46 pm

I'm afraid they're not lined up in either of my regular-sized screens (LCD flatscreen and laptop.)

This sort of positioning is quite tough to do and pretty unpredictable, given the countless screens and resolution settings out there. Best you format your pages using tables that you set at % width. That way, the table will always try to adjust accordingly, albeit not always predictably.

That said, nowadays I reckon the better known companies don't go for the one-size-fits-all website, but prefer to have one regular website and one mobile phone version.

abbym
Regular
Regular
Posts: 63
Joined: Thu, 01 Aug 2013 3:33 pm

Post by abbym » Tue, 20 Aug 2013 6:16 pm

Max Headroom wrote:I'm afraid they're not lined up in either of my regular-sized screens (LCD flatscreen and laptop.)

This sort of positioning is quite tough to do and pretty unpredictable, given the countless screens and resolution settings out there. Best you format your pages using tables that you set at % width. That way, the table will always try to adjust accordingly, albeit not always predictably.

That said, nowadays I reckon the better known companies don't go for the one-size-fits-all website, but prefer to have one regular website and one mobile phone version.
Max, I hope you don't take offence, but please please DO NOT use tables for layout. There are many many reasons why not - just google "tables for layout" to see. But they bulk up your markup unecessarily, making it more expensive for you to serve, and more expensive for people to use (especially mobile users on 3g), they make it difficult to make future updates, difficult to copy and paste text for users, impossible for search engines to decipher what your content is actually about so will reduce your search optimisation...the list goes on.

Going to take a look at your CSS now and see if there are any easy wins. Often though, things need a bit of an overhaul to get detail like this working correctly. And as a side note, it's probably better to use a completely separate style sheet for ipad. Clicking small areas is easy for a mouse, but tricky with a finger. A lot of websites have simplified versions for mobile use which you may want to consider doing.

Edit: Actually, your code is excellent. Very succinct and tidy mark up and clear CSS. IE has your misalignment issue as well as IOS and Android. Cross browser compat isn't my speciality so don't think I can suggest any fixes on this one. However someone on a tech forum should be able to help you on this without you having to hire someone. Look around for CSS forums and it should be easy for them as your code is so tidy.

x9200
Moderator
Moderator
Posts: 10067
Joined: Mon, 07 Sep 2009 4:06 pm
Location: Singapore

Post by x9200 » Tue, 20 Aug 2013 7:24 pm

Sorry, I found these arguments not really convincing. Bandwidth? C'mon, who cares about some objectively redundant text based tags if majority streams heavy weighting multimedia content and the websites just boil with all sort of idiotic and annoying flash based gadgets? Maybe if I were a purist... Equally well you could advocate to write all the non-interpreter based codes in assembler.

User avatar
Max Headroom
Reporter
Reporter
Posts: 921
Joined: Wed, 08 May 2013 11:31 am
Location: Singapore

Post by Max Headroom » Tue, 20 Aug 2013 8:05 pm

I did Google some examples, but they're mostly talking about unnecessarily-nested tables, filled to the rim with spacer gifs and header gifs. These are typical Dreamweaver-type bad habits.

Nothing wrong with tables as such I reckon. They're clean and consistent and, yeah, hardly a bandwidth issue.

Post Reply
  • Similar Topics
    Replies
    Views
    Last post

Return to “Computer, Internet, Phone & Electronics”

Who is online

Users browsing this forum: No registered users and 0 guests