Understanding Strict and Transitional

[brocsman]

I am trying to understand why using different DTDs affects the way my code is interpreted. These six files I have borrowed and adapted to show a simple panel. In the Transitional version the panel displays with nice neat rounded corners at the top. In the Strict version these disappear. I'd be grateful for advice about why this is happening. test.htmtest1.htmbureau_screen.css

[Ingolme]

In Strict mode whitespace is rendered, and the image is placed within it. The box containing the image is the height of the text. Transitional documents render in "almost-standard" mode where they make a few exceptions with images because some old pages used to be made out of a conglomeration of <img> elements. My solution to your problem:Instead of using <img> elements, give the topcurve1 and topcurve2 elements a background-image and then set their width and height to match those of the image.

.topcurve1 {  width: 4px;  height: 4px;    background:url(bx-about1.gif) no-repeat top left;}.topcurve2 {  width: 4px;  height: 4px;  background:url(bx-about2.gif) no-repeat top left;}

[brocsman]

Great - thanks for the reply. I haven't responded earlier because I lost my original posting.