Nightmare of CSS,mesh

CSS is evil!

It is powerful, but confusing as hell! I added Dojo datagrid to some pages, but often things screw up. There are so many similar different styles in css, and there are no error messages when you have a typo or wrong tag. And there are too many things to learn, too many tricks. Especially when I works with the established css setting for our nema.

Coupled with the sitemesh in our project, css can do even more damage. Sitemesh is nice and intercepts all pages and decorate them. However, it is very sensitive to mismatch tags. I had one <div> without close tag, and it mess all things up with the help from CSS. Furthermore, the eclipse and browser cannot validate it well, especially when I have javascript code mixed in. Maybe I should always keep the javascript in separate files.

A few small tricks.

Center block

.mycenter {
margin-left:auto;
margin-right:auto;
}

A absolute value box sit in the center

div#page {
width: 780px;


/* start to use the new absolute position system
*/
position: absolute;
left: 50%;
margin-left: -390px;
top: 5px;
}