HTML and CSS Reference
In-Depth Information
#inner {
width: 75%;
float: left;
background-image: url(images/faux left.jpg);
background-repeat: repeat-y;
background-position: 33.35% top;
#sidebar1 {
width: 30.66%;
padding: 10px 1.33%;
float: left;
#sidebar2 {
width: 23%;
padding: 10px 1%;
float: right;
#main {
width: 62.68%;
padding: 10px 2%;
float: right;
The horizontal background position of the background image for the wrapper<div> is 75% , which ensures
that it's always in alignment with the right sidebar.
As Figure 12-10 shows, the three columns maintain their proportions at different screen widths.
Figure 12-10. The background images remain in alignment with the sidebars
Search WWH ::

Custom Search