Precise Layout that works in all browsers

[vinayak]

Hi

I want to know which layouting/grid solution is the most efficient to work with (meaning work gets done quickly). I have tried lots but all seem to have problems with one browser or the other and I seem to spend tons of time in smoothing out the problems in different browsers.

Thanks in advance.

[John_Betong]

I find that if your page validates correctly then there is very little difference between browsers.

http://jigsaw.w3.org/css-validator/

http://jigsaw.w3.org/css-validator/

Does your page valid with no errors or warnings? If so can you show the web pages with the differences?

One difference I noted is the default browser font size and font-family.

[HAWK]

Hey John,
It's wicked that you're helping out in this thread - thanks, but it's actually here in preparation for the 'Talk With The Experts' chat session next week, where Alex and Paul will talk through the issues live with the OP, so responses aren't necessary.

[Paul O'B]

Hi

I want to know which layouting/grid solution is the most efficient to work with (meaning work gets done quickly). I have tried lots but all seem to have problems with one browser or the other and I seem to spend tons of time in smoothing out the problems in different browsers.

Thanks in advance.

Unfortunately I don't use any grid systems as I find them too confusing, restrictive and bloated. But that's probably just me as others do find a use for them and will sing their praises

I just use css on its own as it is its own grid system and doesn't really need a helping hand. The problem we see with grid layouts in the forum is that the users use them without understanding and once something goes wrong they are totally lost. In most cases you don't want to add code to your page when you don't know what it does or how to fix it when it goes wrong.

It takes a matter of second to float two three or four columns across a layout so I don't really need a grid to tell me how to do it. If you are new to CSS then its worth taking time to look at the grid systems and understand how they work so that you can apply similar techniques in your own builds.

Most coders do have their own sorts of grids in the way of snippets of code and structures that they commonly use and can adapt easily. (To be honest the time it takes to adapt something unless its a simple structure often takes longer than to build it in the first place. Quite often buggy layouts that we see in the forums are often easier to code again from scratch rather than to fix 800 errors.)

If your question was about layout techniques rather than grids then we are still stuck with floats for the time being until the new css3 flexible box modules are fully supported. Also display:table is used more often now that IE6/7 usage has slipped and can be useful for equal columns.