Another way to get the HTML side down (at least it has workd for me) is 
the W3C validator.  I use the Firefox Extension 'Checky'. After a couple 
of site builds with errors, complient code becomes second nature.

CSS is great but different browsers do display differently with IE being 
the most PITA.
I code on Linux and use Firefox/Mozilla for most tests.  Opera and 
FF/Moz is pretty much the same across all OS'es.  Konqurer displays 
pretty much like Safari (althoug I do have a Mac and test with Safari)
I have a hard time testing against IE so I have to visit the in-laws to 
do that.
I do have access to a Win2K server but IE6 on Win2K renders different 
that IE6 on WinXP.  I wish MS would sell the $50 lite windows version 
here in the states.

I use this in most of my CSS (tables, rarely-used, are used for 
corporate data)
body { margin: 0px;}
img { border: 0px;} /* for images that are links */
table, td {padding: 0px;border-spacing: 0px;border-collapse:collapse;} 
/* If tables are used */
        


Alexander Henry wrote:

> On Sat, 28 May 2005 18:45:11 -0700, Siri Amrit Kaur  
> <tigerflag@tigerflag.com> wrote:
>
>> "Integrated HTML and CSS: A Smarter, Faster Way to Learn"
>> http://www.bookpool.com/sm/0782143784
>>
>> It seems like a sane way for me to learn CSS.
>>
>> Siri Amrit
>
>
> <pre>
>
> I started out with the standard O'reilly books.  They were a great  
> starter, but at a point very misleading.  It's almost as if they  
> deliberatly chose tutorial language that makes you write 
> CSS-compliant  code which only works on CSS-compliant browsers, and 
> hardens your brain so  you can't learn how to write CSS-compliant code 
> for all browsers!
>
> Specifically:
>
> When learning padding, border, and margins.  It tells you the W3C  
> compliant way in-depth.  Then there's a small note at the bottom of 
> the  chapter saying IE calculates them differently.  If you declare a 
> width, it  is taken as width with padding, and margin is ignored, 
> while in CSS the  real "width" of the box is the sum of all, width, 
> padding, and margin.
>
> Also, position is calculated differently in different browsers, if you 
> set  it away from defaults.
>
> Later on in the book, it gives you tricks to "hide" stuff from IE.
>
> body > div {
> #Style rules IE won't see
> }
>
> So I'm coding along trying to do all these highly complicated 
> calculations  and re-definitions for all the browsers, and in the end 
> it is of course  still not rendered the same, and it's hell to debug.
>
> REAL SOLUTION:
>
> div {
> padding: 0px 0px 0px 0px;
> margin: 0px 0px 0px 0px;
> border-width: 0px 0px 0px 0px;
> }
>
> DONE!!
>
> IGNORE POSITION COMPLETELY!  Keep it at default.
>
> When defining "layout" structure, only use width, float, and clear to  
> control where you want stuff.  Then, for the elements INSIDE these 
> layout  boxes, define margin and padding.  For some designs, that 
> means you'll  need two divs, one nested right inside another, to get 
> your desired  result.  So mote it be.  This is much easier than the 
> alternatives.
>
> For example, in the image directory thingie I have,  
> http://newclient.ahtechllc.com/Products/ , you'll see that each line 
> is  wrapped in a <div class="line"></div> .  Everything works fine 
> without  these line-divs on all browsers except IE6 on Mac.  It seems 
> to be doing  Japanese, going top-bottom first then left-right to 
> determine the location  of the next left-to-right line element.  So 
> the uneven paragraphs made the  positioning unpredectable.  It was 
> also unpredictable when the image  height was not the same for all 
> images in other browsers.  So the wrapper  div was the solution.  
> Moderate-heavy glitch, easy fix.
>
> </pre>
>

---------------------------------------------------
PLUG-discuss mailing list - PLUG-discuss@lists.plug.phoenix.az.us
To subscribe, unsubscribe, or to change  you mail settings:
http://lists.PLUG.phoenix.az.us/mailman/listinfo/plug-discuss