/me waves
#menu {
background: url(wp-images/gradient.JPG) repeat;
border-top: solid 3px #e0e6e0;
padding: 10px 10px 10px 2px;
position: absolute;
right: 2px;
top: 0;
width: 10em;
}
If you alter the width and the last padding value, does that help in both (I can’t check the redone values in IE here) ?
Thread Starter
amydef
(@amydef)
Hi Podz!
With those adjustments, the IE smooshes the menu text right up against the (left)edge of the menu’s box. IE Screenshot at http://www.epigraph.org/trials/layoutboogers/IE10emleft2.jpg
The original in IE (which is what I’m hoping to get) looks like http://www.epigraph.org/trials/layoutboogers/IE11emleft20orig.JPG
As far as the FF goes, when I try the 10em and 2px, the material in the sidebar ends up wrapping more than I want it to. For example, home and contact end up on different lines, and the description at the top ends up sort of tall and skinny. The gap on the left isn’t as bad, but still not what I was getting in IE. Grr. wasted space and then cramped text. I guess it’s something other than padding doing that.
Amy
amy your menu has a fixed with of 10em. For that reaon I would not use any padding at all unless you are prepared for a lot of exotic hacking. A simple solution is to use margins instead. HTH.
Thread Starter
amydef
(@amydef)
Actually 11em. You might have ducked in while I was trying the 10 per the last suggestion. (I’ll set up another page for all these adjustments.) At any rate, with margins I’m just getting space around the green box: http://www.epigraph.org/trials/layoutboogers/IE11marginsnopadding.JPG and I do want a little space between the edge of the text and the edge of the box.
(Thanks for looking at this, Root.)
Thread Starter
amydef
(@amydef)
ok. I just got back from http://www.webmasterworld.com/forum83/5499.htm and I think I’ve got it. Root, I’m sorry if I missed what you were saying: nested containers, with margins set for the inside one, to replace the padding.
One thing of interest, though. Even after I did this, I still had that extra left margin, inside the inside box in FF. I had to specifically define the ul as having padding-left: 0px. It was as though it was defaulting to something else.
I’m sure there are other problems like this lying around, but at least now I know what to look for.
ul / li indents by default. Nested containers was indeed what I meant. Well done 🙂
