Anyone any good at CSS2?

(wraith_)

New member
As part of the process of updating The Whirlpool's code, I'm trying to get rid of the really bad HTML 3.2/4.0 and replace it with standards-compliant XHTML and CSS2.

I'm almost done with that part of it. Almost.

Does anyone know what all the proprties are for tables cells to make sure they have no spacing around them? This is what I'm using right now:
<span style='font-family: courier;'>
td.classname
{
    padding: 0px;
    margin: 0px;
    border-width: 0px;
    border-style: none;
    border-spacing: 0px;
}
</span>
And this works PERFECTLY in Firefox. IE, however, is still spacing each table cell with 1px of the table's bgcolor (so effectively there's two pixels separating each cell and one pixel on the outside of the table).

arg_ie.png


Is there one other property I should be setting to 0px to make IE happy?

Also, in case if you're wondering about the extra space on the bottom side of the rows, that's due to an issue (which I'm fairly sure is unrelated) with images having 3 extra pixels tacked on to their bottom side... but one issue at a time. :)

<P ID="signature"><hr width=350 align=left>
signature.gif
</P>
 
Why not make each area of the sidebar a div? You could do something like this:

< div id="whatever" >
< img src="top" />
some text
< img src="bottom" />
< /div >

div#whatever { background: url('repeat-y_image'); background-repeat: repeat-y; }

See the attached image for an example of the kinds of images to make.

<P ID="signature">--------------------

peepos.gif


Welcome to the Bryant Street Theatre. Have a Fruit Roll-Up.</P>

C:Serverxampphtdocszopharoldwwwthreadsattachmentscss2_example.jpg
 
I believe you are missing this: border-collapse: collapse;
This style is working for me in IE and Firefox.

table
{
padding: 0px;
margin: 0px;
border-width: 0px;
border-style: none;
border-spacing: 0px;
border-collapse: collapse;

}

table td
{
padding: 0px;
margin: 0px;
border-width: 0px;
border-style: none;
border-spacing: 0px;

}<P ID="edit"><FONT class="small">Edited by Ugly Joe on 02/27/05 06:57 PM.</FONT></P>
 
Your last post looked like shit for me under Mozilla Firefox 1.0.1.

<P ID="signature"><marquee direction=left scrollamount=8><img src=http://home.graffiti.net/lillymon:graffiti.net/images/keletav.gif></marquee>
!luos ruoy tae lliw stelek ehT</P>
 
> Your last post looked like shit for me under Mozilla Firefox
> 1.0.1.
>
Yup, ZMD will parse your table tags if you put them in your post <img src=smilies/retard.gif>. Editing...

<P ID="signature"></P>
 
This is what I was trying to post along with the style earlier.

Also, about the space under the images. It looks like it's being caused by extra whitespace in the cell. Try getting rid of white space, like, "<td><img src="ul.gif" /></td>", don't put any newlines or anything in there to make it look more readable.

<P ID="signature"></P>
 
Now if I could just get IE to handle margin-left: auto; and margin-right: auto; correctly :p

<P ID="signature"><hr width=350 align=left>
signature.gif
</P>
 
> Now if I could just get IE to handle margin-left: auto; and
> margin-right: auto; correctly :p
>

yea, there is a way around that. I forgot what it was though. oh wait.. I remember.

add this around the table:
<div class=iefix>
(auto aligned table or div)
</div

and the css:
.iefix {
text-align: center;
}


I am fairly certain that is the fix for it.

<P ID="signature"><img src=http://www.neohjuggalos.com/sig.png></P>
 
Back
Top Bottom