fuerstnet

• Ten CSS tricks you may not know:
• CSS font shorthand rule
• Two classes together
• CSS border default value,
• CSS document for printing
• Image replacement technique
• CSS box model hack alternative
• Centre aligning a block element
• Vertically aligning with CSS
• CSS positioning within a container
• Background colour running to the screen bottom
• Ten more CSS tricks you may not know
• Block vs. inline level elements
• Another box model hack alternative
• Minimum width for a page
• IE and width & height issues
• Text-transform command
• Disappearing text or images in IE?
• Invisible text
• CSS document for handhelds
• 3-d push button effect
• Same navigation code on every page (but highliting active part)
• Boxen mit Mindesthöhe versehen: min-height benutzen. IE6 kennt kein min-height, interpretiert height aber wie min-height. Zusätzlich liest der IE6 ein _height als height, so daß man gefahrlos eine Höhe für den IE6 angeben kann, die die Höhe für andere Browser nicht beeinflußt. Eine sich automatisch erweiternde Box mit Mindesthöhe 4em sieht so aus:

 div.blah { 
   height: auto;
   min-height: 4em;
   _height: 4em;
 }

• Absolute positionierte Boxen + Inhalt horizontal zentrieren: http://www.zachgraeve.com/2006/10/01/center-abosulte-position-div/

 

    
xyz_main {

    width: 140px;
    position: absolute;
    left: 50%;
    margin-left: -70px;

By setting the left position to 50% it will set the div to start in the center of the screen. By adjusting the left margin by a value half of the size of the div we are centering, we can move the entire div to the left and place it directly in the center of the page.