Great to see such a forum, where individuals try so hard to help each other. A big well done to Hugh for taking time to work on Pete's CSS. Hope this helps also: http://lc55.co.uk/test/jazz.jpg This is how Hugh's re-design looks in Opera 7
Regards, JG --- Hugh Todd <[EMAIL PROTECTED]> wrote: Pete, I've taken the liberty of rejigging your style sheets to get this thing to work. I did change the doctype to strict. Don't know what --if any -- that had to do with the final outcome. http://members.ozemail.com.au/~hughtodd/gifford/ Here's what I did. In the top section, I made the rh masthead item a background image instead. This left the other two elements free to float left in an uncomplicated way. To get rid of the space before the graphics started in Opera 6.03 Mac, I added "padding: 0;" to the body. To ensure that the navbar doesn't push the top section apart (vertically) if the tab text is increased in size, the top float is positioned relatively and the ul inside it positioned absolutely at its bottom. (To make it expand up instead of down.) In the lower section I discovered (late in the piece, and it was -- bizarrely -- causing the main image to float in the wrong place) that the HTML for second of the h1s was in uppercase (H1). Something to watch, at least in strict XHTML, which I know you weren't using. I added an extra centred div ("mid") in which I floated *both* the text block and the image to the *left*. (You had the image floated right, which necessitated putting it before the text div in the HTML, which led to clearing problems for your footer.) There was a bug in IE 6 Win that pushed the picture down, and this seemed to be related somehow to this bug: http://www.positioniseverything.net/explorer/escape-floats.html . The gist of the problem is that IE resizes a DIV if it thinks that it is not large enough to hold its content. Which means, as here, it was adding another 2px to the floated DIV with the img inside it and pushing it down to the next line. [No idea why. It seemed to be the correct width.] Simplifying the code by stripping out the DIV and applying the id to the image itself fixed the problem! The footer sits after the floated "innermid" but before the close of the new "mid" wrapper. For some reason the middle section is pushed a few pixels down in the IE Wins (5-6) -- surprise, surprise -- but I'll leave someone else to sort that out. Otherwise it looks mighty fine in Safari, Mozilla 1.6, IE5 Mac and Opera 6.3 Mac. Took me quite a lot longer than your half an hour, probably because I was having to go backwards through your code, but it's satisfying to have it done! -Hugh Todd > Here's the other one that was giving me so much grief last night, > finally working with the help of a few two column tables: > > http://www.universalhead.com/clients/test > > The Homepage and the 'Classes' page layouts are currently done (text > styling to do yet). > > Comments welcome ***************************************************** The discussion list for http://webstandardsgroup.org/ ***************************************************** _____________________________________________________________ Why Pay $35 for a .COM, .NET or .ORG Web Address? iDotz.Net offers Cool Domains @ Great Prices! Starting @ $8.75 Go: http://www.idotz.net ***************************************************** The discussion list for http://webstandardsgroup.org/ *****************************************************
