"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

• Fruit
  
  
  
  • Apple
    
    
    
    • Granny Smith
    
    
    
    
    
  
  
  • Orange
  
  
  • Banana
  
  
  
  


• Vegetables
  
  
  
  
  • Carrot
  
  
  • Onion
  
  
  • Peas
  
  
  
  

function toggleAnswer(ul_id) {
var u = document.getElementById(ul_id);

if(u.className == "hiddenAnswer") {
u.className = null;
} else {
u.className = "hiddenAnswer";
}
}

// then create a css class like so...

.hiddenAnswer {
display: none;
}

You need to wrap in another div, and center via that one.

e.g.

body {
text-align: center;
}

.outer_div {
text-align: left;
width: 750px;
height: 500px;
background: white;
padding: 5px;
margin: 0 auto;
}

p a {
     background-color:blue
}

p > a{
     background-color:red
}

In IE we will see a blue red link.

div.container{
background:#fff;
border:1px solid #8E221B;
margin:0 auto;
width:60%;
height:100%;
 
}
html > body div.container{
min-height:100%;
}

This css code explands de "container" div. It simulates old table layouts with 100% height.

Throw this at the top of your first CSS rules, and you should have a few less headaches with layouts.

*
{
margin: 0;
padding: 0;
}

Note: You have to then add margins/padding to *every* element that needs it (p, dl, ul, etc), otherwise things will look a little odd.

Using various hack management techniques publicized by Doug Bowman and Molly Holzschlag, this is the default stylesheet I to in the head of my markup:

/*
        [CLIENT] screen master
*/
@import url("core.css");

/* Import WinIEx-only bugs - hide from Mac IE5 \*/
@import url("hacks.win.iex.css");
/* END hide from Mac IE5 */

/*       Import Win IE5x hacks
        ---------------------
*/

@media tty {
        i{content:"\";/*" "*/}} @import 'hacks.win.ie5.css'; /*";}
}/* */

/*       Import Mac IE5 hacks
        --------------------
*/

/*\*//*/
@import url("hacks.mac.ie5.css");
/**/

The core.css file contains my pure, "hack free" CSS. The other files referenced above contain any and all browser-specific hackery required to make IElesser browsers behave properly.

Sometimes you just have to resort to the hacks; this bit of code will let you feed three separate values for the same property to each of the three common flavors of IE on Windows:

* html whatevertherestofyourselectorwouldbe {
property/**/: value;
property: /**/ value;
p\roperty: value;
}

The first value will be applied by IE5.5, the second by IE5.0 and the third by IE6.0. The order is important; mix them up and it won't work. The "* html" on the selector ensures that only IE on Windows will see any of the values (since it mistakenly thinks there's a higher root element above html).

This was constructed from the table of CSS hacks at dithered.