Electronic Books

links removed to save space
end nav div
the center column
start of page content
tree-saving removal of content
end content inner
end of content div
end of twocolwrap div
content removed here
end of inner promo div
end of promo div
end of threecolwrap div
end of footer inner div
end footer div
end main_wrapper div
STYLIN??™ WITH CSS - CHAPTER 5 158
This is the same markup as we have used in earlier examples, with
the addition of the two highlighted wrapper divs. The associated
CSS looks like this
body {font: .8em verdana, arial, sans-serif;}
* {margin:0; padding:0;}
div#main_wrapper {min-width:760px; max-width:880px;
margin-left:auto; margin-right:auto;}
div#header {
width:auto;
}
#threecolwrap {
?¬‚ oat:left;
width:100%;
}
#twocolwrap {
?¬‚ oat:left;
width:100%;
display:inline;
margin-right:-170px;
}
#nav {
?¬‚ oat:left;
width:150px;
display:inline;
}
#content {
width:auto;
margin-left:150px;
margin-right:170px;
}
centers layout when > max width
stops IE doubling margin on ?¬‚ oat
negative margin move
stops IE6 bug from doubling
margin on ?¬‚ oat
BASIC PAGE LAYOUT 159
#promo {
?¬‚ oat:left;
width:170px;
}
#footer {
width:100%;
clear:both;
?¬‚ oat:left;
}
In this layout also, the center column does not have a speci?¬? ed
width.


Pages:
177 178 179 180 181 182 183 184 185 186 187 188 189 190 191 192 193 194 195 196 197 198 199 200 201