Tuesday 26th of September 2017 12:19:47 AM

MENU left

Menu with fixed width.

#left {
width:175px;
padding:0px;
float:left;
}

CONTENT

All templates are XHTML 1.0 and CSS2/ tableless.
3 columns layout grid. All colums are fixed and centered.
more nice and free css templates

html {
padding:0px;
margin:0px;
}
body {
background-color: #e1ddd9;
font-size: 12px;
color:#564b47;
text-align:center;
margin:0px;
padding:0px;
}
#box {
width:750px;
margin: 0px auto;
padding:0px;
text-align:left;
}
#content {
width:400px;
padding:0px;
float:left;
larger than the surrounding text.
</P>

Now we're back to our earlier example, where the middle line box is taller than the other line boxes. However, notice how the "tall" text is aligned in Figure 8-54.

Figure 8-54

Figure 8-54. Top-aligning text

What's happened here is that the top of the "tall" text's inline box is aligned with the top of the line box. Since the "tall" text has equal values for background-color:#fff; overflow: auto; } #head { background-color:transparent; }


For Navigator, though, you have to set the top margin of theparagraph to be -1em to get the same effect, whichwill hopelessly mangle Explorer's display of the document. Howto resolve the conflict?

First, place all your Navigator-unfriendly rules into an externalstyle sheet and hook that up using an @importstatement. Then place all of your Navigator-friendly margin rulesinto another external style sheet and LINK it in.( Just make sure your LINK comes before thewith the concept of floated elements. Ever since Netscape 1.0, it has been possible to float images by declaring, for instance, <IMG SRC="b5.gif" align="right">. This causes an image to float to the right, and allows other content (text or other images) to "flow around" the image. In the past, this was only possible with images and, in some browsers, tables. CSS, on the other hand, allows any element to float, from images to paragraphs to lists. In CSS, this behavior is accomplished using the property float. it into an H1 and set styles on that element. At arough visual guess, the text is about three times larger than thebody text, and the space between each letter is about the size of oneof the letters. Starting with the easy stuff, here's what wehave for the title H1:

H1 {font: 300% Helvetica,sans-serif; font-variant: small-caps;letter-spacing: 0.75em;}

As was already observed, the title is right-justified but isn'tup against the right margin. The easiest thing to do is insert some