[UPHPU] More CSS frustration

[cole at colejoplin.com]

Hi John,

I did my last table layout about 5 years ago, the day before a  
designer showed me www.csszengarden.com. That was it for me. Moving to  
tableless-layout is hard, there's no denying that fact. There are a  
number of different solutions for any CSS layout, but finding one that  
is cross-browser requires some real work.

I'll share what works for me. I definitely recommend the ZenGarden  
book, which I bought. Every book on CSS I've had has been technical in  
nature. Zen really meshes design and technical in a way that is, in my  
view, far more comprehensive, and reveals the purpose of CSS  
brilliantly. Personally, I think it's required reading if you're doing  
CSS, otherwise you only have half the story at best. Here's one of the  
best lessons about the site and the book: If you're going to use CSS,  
embrace its purpose, especially flexibility.

Case in point, the AListApart site. It has some fantastic examples,  
but also some that I think are crap, because they rely on hacks. And  
this brings me to what I think you should consider when doing CSS: be  
skeptical and be disciplined. When I see a hack example, I refuse to  
use it. I cringe when I hear people say they **HAD** to use this hack  
they found, blah, blah... This will only increase your frustration.  
Hacks are not flexible, they are browser-dependent. This goes against  
the purpose of CSS.

Secondly, be disciplined in avoiding markup that forces a layout. Try  
viewing your html file, without any css file (always external,  
please). Does the page make sense? Is it devoid of layout information?  
Have you used <H2>, <H2>, <P> like the purpose of the tags ask you to  
follow? It also helps your natural SEO. If you see a <BR> tag  
anywhere, you know for a fact that the markup is not disciplined for  
CSS. Put your links/menus in a list <UL>, which can be vertically or  
horizontally styled later. Your markup plays a very big part in CSS.

Do those two things and you have a better chance of success. But it's  
always painful to get cross-browser. So learn multiple startegies,  
learn the box model, definitely learn floats. Post your page  
somewhere, and use the group to help.

-- Cole



Quoting Victor Villa <vvilla at gmail.com>:

> -----Original Message-----
> From: uphpu-bounces at uphpu.org [mailto:uphpu-bounces at uphpu.org] On Behalf Of
> jtaber
> Sent: Sunday, January 14, 2007 11:24 PM
> To: UPHPU List
> Subject: [UPHPU] More CSS frustration
>
> I thought I would make some design changes to our web pages  and clean
> up some of the CSS away from absolute positioning (which seems risky on
> cross-browsers and fonts) and is a real pain every time you try to
> rearrange stuff.  But although I'm trying to keep everything simple,
> after the entire weekend, I've got a mess on my hands.
>
> Now I notice that most web sites are using CSS so I've been bound and
> determined to get it right on our site.  Trying to follow stuff on "A
> List Apart" just seems to lead into trouble - heck even "vertical-align"
> just isn't working right - much less not even testing it on non-Firefox
> browsers.  I realize CSS offers more control over tables but is it
> really worth it ?  This could have done this less beautiful in several
> hours with tables though I realize good appearance is critical on a web
> services site.  Are the bigger sites just throwing money at it and
> hiring CSS "gurus" that know all the little tweaks, etc (this doesn't
> seem to be a cost effective approach to our low funded effort).  How are
> others on this list doing fairly bulletproof CSS ?  Is there some
> relatively easy way or guide that we should use or should we just use
> tables until some later day if ever?
>
> _______________________________________________
>
> John,
>
> I've been able to migrate over to CSS.  It has definitely been hard, but in
> the long term has been beneficial.
>
> The book that has helped me the most is the Zen of CSS by David Shea.  The
> online reference I use the most is w3schools.com's section on CSS.
>
> If you can send the list a picture of the site and places your having
> trouble, we could help you transition.
>
> mS
>
>
> _______________________________________________
>
> UPHPU mailing list
> UPHPU at uphpu.org
> http://uphpu.org/mailman/listinfo/uphpu
> IRC: #uphpu on irc.freenode.net
>