From my previous question: Adding Doctype Destroys Layout I figured out that the right:-10; statement in:
#nav li:after {
width:10px;
content:"";
background: url('tabRight.png');
position:absolute;
height:100%;
top:0;
right:-10; /*HERE*/
}
completely messes up my tab menu layout with an added doctype. If I remove that statement or set right:0; everything is fixed and the doctype stays in place. There is a small problem however, shifting the right image over to the right 10 pixels is what made my “closing-doors” technique work. This is because the right sliding door has a transparent background and when the doors are “closed” the right shift apparently didn’t let the transparency be obscured by the left door. The picture below hopefully describe things better.

The blue border is the right door, the red is the li element, the green is the ul element. The second picture shows the right shift done with the :after pseudo. Is there any way to fix this issue, or does anyone know a simple technique around this? The html code is in my previous question up above. Thanks in advance!
Units are required in standards mode. Use
right: -10px;.