Graphics Programs Reference
In-Depth Information
At this point, nothing will really change unless you shrink the browser window until it of ers
fewer than 800 pixels across to the document (see Figure 7-4). At that point, the columns stop
l oating altogether.
237
Figure 7-4: What happens below 800 pixels.
What you can do at this point is write another media-query block of layout rules that apply in
narrower conditions. Say you want a two-column layout between 500 and 800 pixels, as in
Figure 7-5).
@media
all and (min-width: 500px) and (max-width: 799px) {
.col
{
float
:
left
;
width
:
20%
;}
#two
{
float
:
right
;
width
:
69%
;}
#three
{
clear
:
left
;
margin-top
:
0
;}
}
Search WWH ::
Custom Search