03 April 2005 Sunday

Learning css/xhtml along the way

xhtml standards has so many rules... in 'strict' apparently a <blockquote> must contain <p> tags.. good to be reminded about <cite> for inline quotes.. though sometimes you really just want a blockquote within a blockquote -- which apparently thoroughly illegal in 'standards-compliant' xhtml world.

what else have i learned...

oh, i learned that freak out internet explorer. that is, everything following the blockquote will be shifted to the side, and when you hover something hoverable with your mouse, sometimes it will shift back over. what seems to solve it is to float the blockquote. seriously. that makes IE happy. maybe it's not just blockquotes..i don't think it is... but the screwiness is definitely there.

*04april2005: update on the blockquote thing..

css and multiple background images are unhappy. to get them to work you need multiple nested divs. and of course they won't line up the same in IE as in Firefox and Opera. (thank goodness those two tend to agree on the lining-up of things... although it seems Firefox does not believe in margins sometimes, and will only believe padding. Opera (and even IE) believes in both, in those same instances. now my biggest challenge is going to be dealing with Safari... the lining-up issues that i run into with IE are thwartable by using * html classname{} in the css file, or calling a hidden CSS file from the html file via . but how do i make something readable by Safari only? i guess that's the next research assignment...
i intend to be back with answers.

*: 5 mintues later:
found this from here by Martin:

/*------------STOKELY SAFARI HACK----------------*/
.dummy1 {
color: green;
font-size:12px;
}

#test1 {
color: green;
font-size:12px;
}

/*\*/
html*#test1 {

[color:red;/*required by Safari so that [] is correctly begun. associated with the property, yet hiding it. seen by IE6*/

color:blue;/*these are seen by IE6 and Safari but hidden from Netscape6-7*/
font-size:30px;/*these are seen by IE6 and Safari but hidden from Netscape6-7*/
font-weight:bold;/*these are seen by IE6 and Safari but hidden from Netscape6-7*/

]color:green;/*Reset IE6 properties and hide from Safari. required by Safari so that [] is correctly ended. associated with the property, yet hiding it. seen by IE6*/

<div class="dummy1">
this is green dummy text before the rule
</div>

<div id="test1">
Stokely Safari Hack : If you See large blue text here, you are using Safari. Small and green, its not Safari.
</div>

<div class="dummy2">
this is green dummy text after the rule to make sure the next declaration is not broken
</div>

that did not entirely make sense to me, but i've got the gist.... thing is, i'm not going to be able to test thing without a safari user on the other end testing this every few minutes to see the results.. well that will be fun. (and i thought IE was a bother)

*another 40 seconds later: i'll be using iCapture as my testing lens, i spose.