Die Höhe von Elementen begrenzen (min-height, max-height)

<style type="text/css">
<!--
.colorbox { border: 1px solid silver; width: 150px; margin: 0px 10px 1em 0; float: left; }
.meRahmen { height: 300px; background: url(bilder/raster.png); border: 1px solid silver; padding-left: 50px; width: 570px;}
#minh1 { background: lightsalmon; height: 150px; }
#minh2 { background: seashell; min-height: 150px; max-height: 250px; }
#minh3 { background: wheat; min-height: 150px; max-height: 250px; }
-->
</style>

<div id="minh1" class="colorbox">Lorem ipsum dolor sit amet, consectetuer adipiscing elit. ... </div>
<div id="minh2" class="colorbox">Lorem ipsum</div>
<div id="minh3" class="colorbox">Lorem ipsum dolor sit amet, consectetuer adipiscing elit. ... </div>

Die mittlere leere Box muss auf ohne entsprechende Inhalte eine Höhe von 150 Pixeln aufweisen.

Hinweis: Der "Überfluss" kann mit overflow: hidden oder overflow: scroll beschnitten werden.

Die Breite von Elementen begrenzen (min-width, max-width)

<style type="text/css">
<!--
#meLinks { float: left; width: 30%; min-width: 150px; max-width: 200px; }
#meRechts { float: right; width: 65%; }
-->
</style>

<div id="meLinks">
   <h4>meLinks</h4>
   <p>min-width: 150px; max-width: 200px; width:30%;</p>
   <p>Lorem ipsum dolor sit amet, ... </p>
</div>
<div id="meRechts">
   <h4> meRechts </h4>
   <p> width: 65% </p>
   <p>Suspendisse ac elit. Vestibulum dolor. ... </p>
</div>

Die linke Box soll eine minimale Breite von 150 Pixeln und eine maximale Breite von 200 Pixeln aufweisen, je nach dem, wie weit das Browserfenster aufgezogen wird. Wird dass Fenster verkleinert, muss die rechte Box irgendwann unter die linke Box rutschen. Das Beispiel funktioniert nicht in Internet Explorer (Win und Mac), da Internet Explorer min-widht und max-width nicht unterstützt.