Friday 24th of February 2017 01:53:06 PM

Book Home

Cascading Style Sheets: The Definitive GuideSearch this book

Symbols | A | B | C | D | E | F | G | H | I | J | K | L | M | N | O | P | Q | R | S wider when it hits 400 pixels. The appropriate styles are:

left: 0%; right: auto; width: 75%; max-width: 400px;

The great advantage of the min-max properties is that they let youmix units with relative safety. You can set percentage-based sizeswhile setting length-based limits, or vice versa.

TIP

These min-max properties can be very useful in conjunction withloated elements as well. For example, you | T | U | V | W | X | Y | Z

Index: M

margin-bottom property: 7.3.4. Single-Side Margin Properties
margin-left property: 7.3.4. Single-Side Margin Properties
margin property: 7.3. Margins
margin-right property: 7.3.4. Single-Side Margin Properties
margin-top property: 7.3.4. Single-Side Margin Properties
margins: 7. Boxes and Borders
7.3. Margins
collapsing: 7.3.5. Collapsing Margins
block-level elements: 8.2.1.2. Collapsing vertical margins
floated elements: 7.6.1. Floated Elements
horizontal, noncollapsing: 8.2.2. Horizontal Formatting
inline elements and: 7.3.7. Margins and Inline Elements
caution with: 7.3.8. Margins: Known Issues
length values and: 7.3.1. Length Values and Margins
negative (see negative margins)
vs. padding: 7.2. Margins or Padding?
percentages and: 7.3.2. Percentages and Margins
replication: 7.3.3. Replicating Values
single side, setting margin for: 7.3.4. Single-Side Margin Properties
table cells and: 1.3.1. Limited Initial Scope
markers: 8.2.3. List Items
8.2.3. List Items
10.4.2. Markers
matching hyphenated values: 10.2.2.5. Matching hyphenated values
matching single attribute values: 10.2.2.3. Matching single attribute values
max-height property: 9.1.3.2. Limiting width and height
max-width property: 9.1.3.2. Limiting width and height
media types: 1.3.1. Limited Initial Scope
10.8. Media Types and @-rules
Microsoft Internet Explorer (see Internet Explorer)
middle alignment: 4.1.3.5. In the middle
millimeters (mm): 3.2.1. Absolute Length Units
min-height property: 9.1.3.2. Limiting width and height
min-max properties: 9.1.3.2. Limiting width and height
min-width property: 9.1.3.2. Limiting width and height
monospace fonts: 5.1. Font Families
multiple pages, using styles on: 1.2.3. Using Your Styles on Multiple Pages


Symbols | A | B | C | D | E | F | G | H | I | J | K | L | M | N | O | P | Q | R | S | T | U | V | W | X | Y | Z


Library Navigation Links

Copyright © 2002 O'Reilly & Associates, Inc. All Rights Reserved.

with the bottom of the line box. For example, this markup results in Figure 4-34:

IMG.feeder {vertical-align: bottom;}
<P>This paragraph contains an image <IMG SRC="tall.gif" ALIGN="middle"
ALT="tall image"> which is tall, and another image <IMG SRC="short.gif"
CLASS="feeder" ALT="short image"> which is not tall.</P>
Figure 4-34

Figure 4-34. Bottom alignment

As you can see from Figure 4-34, the second line of the paragraph contains two images, and their bottom edges are aligned