Skip over navigation
This web site is about Cascading Style Sheets as a means to separate the presentation from the structural markup of a web site, and it will help you answer some of those frequently asked Questions, explains some of the Basics of CSS, gives you tips and tricks for tackling the problems with Netscape 4, offers you a tutorial about Positioning with CSS (CSS-P, web design without tables). There is also a page with interesting Links.
This page uses CSS to present the content in the best possible manner. If you can see this message, then CSS (or JavaScript) is not enabled in your browser, and the page will not appear as the designer intended.
In NN 4.xx, you cannot assign most styles to the <TABLE> or <TR> elements, use the <TD> element instead. Background image and color, on the other hand, can be declared on the <TABLE> tag.
Do not use margin-, padding-, or border- properties on table, tr, td, or th elements, this doesn't work properly.
If you need to set special margins, borders, or padding inside a table cell, then use this markup:
<td><div class="table-cell"> yourtext </div></td>
to apply the CSS rules to the div inside the cell.
To give a table a border you don't have to work with nested tables. Simply wrap this table in a <div>, like:
.tblbor {
border-width: 1px;
border-style: solid;
border-color: #CCCCCC;
}
You put this style declaration either in an external stylesheet or in the <head></head> section and apply it to the table as follows:
<div class="tblbor">
<table>
<tr>
<td>Content text and more content</td>
</tr>
</table>
</div>
That should give you a thin grey border around this table. You can also play with other border-style properties (like outset, or ridge) to give the impression of a 'bevelled' table.
If you want to know how to style a list, I recommend the Project VII List Style Tutorial.
Assigning styles to the <li> tag in NN 4.xx only affects the bullet and not the text as it should. The <dt> and <dd> tags have a similar problem. To work around the problem, enclose the text with a <span> tag or assign the style to the <ul>, <ol> or <dl> tag.
Another bug is connected to {list-style-type: none;} or {list-style: none;}. NN 4.xx MAC displays question marks instead of "no bullets", and if you declared "margin" or "padding" in the <UL> or <LI> style, then NN 4.xx will show the bullets. On the other hand, applying "padding" and "margin" on list styles where you want the bullets to show usually suppresses the bullets.
Other topics: