Monday 25th of May 2015 03:11:50 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 | 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


As wonderful as all of this is, there arises a serious question.Suppose you have a positioned element that you don't want to beany smaller than a certain size? Consider the following styles:

top: 10%; bottom: 20%; left: 50%; right: 10%;

Thus the height is 70%, and the width 40% of the containingblock's height and width. That's fine as far as itgoes -- but what happens if the containing block is only 50 pixels src="../../gifs/smnavbar.gif" usemap="#library-map" border="0" alt="Library Navigation Links" >

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

Analysis Lab is a proud sponsor of this website.  The animatedGIF image is also a link.  By default, a linked image has a 2-pixelwide blue border, but I suppressed that with the BORDER=0 attribute inthe IMG tag.
The animated GIF logo was created by sequencing still GIF'swith Microsoft's GIF Animator (a freebie you can pull off the web). The image is square, but the white image background blends seamlessly with better to define certain limits for the size of the height and width?

9.1.3.2. Limiting width and height

Should it become necessary or desirable, you can place limits on an element's width and height by using the following CSS2 properties, which I'll refer to as the min-max properties.

but we enhance the idea of "underlining" by setting abottom border that will extend from the left edge of the text all theway out to the right edge of the browser window. This line will alsoinherit the green color of the text and so really punch up the factthat the title and navigation buttons are separate from the rest ofthe page.

Now that this is all done, we need to link the style sheet into thesite's pages. The above declarations are collected into asingle file, which is saved to a file with the URL http://www.mycomp.com/style/site.css. Then