I’ve got a layout I’m currently toiling away at that’s working just fine in Firefox, Safari, and Chrome but is giving me grief in IE. Have a look at the following link in your choice in the above working browsers, and then in IE. http://lisa-noble.com/test/redo.html
Why the heck is IE sticking that blank space in the bottom left side? :?
Here is the CSS related to the bottom left corner and footer:
Okay, well after thinking about this for a bit, I think the best way to fix this is by creating those boxes differently. Your problem is not just in IE, it’s in FF too, if you resize your browser your box gets resized too. I downloaded the page and played around for a while, I came up with a solution but to be honest it is kinda stupid to do it. I would simply suggest doing it a different way – like this.
The concept is explain in Chris’s Rounded edge boxes screencast, and here is my preferred method.
I watched the whole rounded corners screencast that Chris did, great stuff!
I think that method#2 that he did would work for me but the issue that I’m running into is that I need the site to be fully liquid, it needs to be able to expand and contract vertically and horizontally. The client wants it to look like there is a frame around the page at all times, they don’t want that frame to ever move, and they want the content to scroll in the middle of that.
So the problem is that I need the graphic slice from the top and bottom of the frame to repeat-x, the left and right ones to repeat-y, and then the corners should stay stuck in the corners. I like the way that Chris affixed the corners in his example for box 2, but since I’m not just putting a border around the rest of the box but need to tile 4 graphics slices I’m a bit stuck. I could tile one as the body background, one as the page wrap background, one as the box background but then…I ran out of boxes. LOL
I suppose I could just make another one that is the same size, it would kind of be like layers. Hm, I’ll go play around with that and report back. :)