Velocity Reviews - Computer Hardware Reviews

Velocity Reviews > Newsgroups > Programming > HTML > Browser differences

Reply
Thread Tools

Browser differences

 
 
Chris Leonard
Guest
Posts: n/a
 
      09-25-2003
Aaarrghhhhhhhh

I designed what I felt was an aesthetically nice set of pages, I honed them
down to what I felt was near perfection from a pleasing design point of
view - good old IE5.5, looks wonderful.

Then I showed one of my mates at work and almost fell off my chair, in IE6.0
it looks awful! How can this be !!! why do the ribbons no longer look
correct - the left hand ribbon is infact the page background, the "main"
ribbon is a div set to 100% height so it "should" reach the bottom of any
page and effectively block out the background. this works nicely in IE5.5
but it's an ugly mess in IE6.0 which is like an "L"

Can anyone shed some light on where I'm going wrong please, I'm new to this
CSS stuff and I thought I'd made quite a good job - seems I've not really!
Better not give up the day job yet eh!

TIA

Chris

http://www.theleonardfamily.co.uk/cssmenu/menuintro.htm


 
Reply With Quote
 
 
 
 
Adrienne
Guest
Posts: n/a
 
      09-25-2003
Gazing into my crystal ball I observed "Chris Leonard"
<(E-Mail Removed)> writing in
news:bkvosp$qek$(E-Mail Removed):

> Aaarrghhhhhhhh
>
> I designed what I felt was an aesthetically nice set of pages, I honed
> them down to what I felt was near perfection from a pleasing design
> point of view - good old IE5.5, looks wonderful.
>
> Then I showed one of my mates at work and almost fell off my chair, in
> IE6.0 it looks awful! How can this be !!! why do the ribbons no longer
> look correct - the left hand ribbon is infact the page background, the
> "main" ribbon is a div set to 100% height so it "should" reach the
> bottom of any page and effectively block out the background. this works
> nicely in IE5.5 but it's an ugly mess in IE6.0 which is like an "L"
>
> Can anyone shed some light on where I'm going wrong please, I'm new to
> this CSS stuff and I thought I'd made quite a good job - seems I've not
> really! Better not give up the day job yet eh!
>
> TIA
>
> Chris
>
> http://www.theleonardfamily.co.uk/cssmenu/menuintro.htm
>
>
>


IE6 is a never ending source of hair pulling for me as well (remember when
it was NS4?). What I've done is explitedly define a height in pixels, say
700px for divs that _should_be 100%. There are probably better ways to do
this... anyone?

--
Adrienne Boswell
Please respond to the group so others can share
http://www.arbpen.com
 
Reply With Quote
 
 
 
 
=?iso-8859-1?Q?brucie?=
Guest
Posts: n/a
 
      09-25-2003
In post <bkvosp$qek$(E-Mail Removed)>
Chris Leonard said...

> good old IE5.5, looks wonderful.[...] in IE6.0
> it looks awful! How can this be !!!


major changes were made to IE6 to bring it into compliance with the
w3c recommendations.

http://msdn.microsoft.com/library/en...hancements.asp

--
26/September/2003 09:45:15 am
 
Reply With Quote
 
rf
Guest
Posts: n/a
 
      09-26-2003

"Chris Leonard" <(E-Mail Removed)> wrote in message
news:bkvosp$qek$(E-Mail Removed)...
> Aaarrghhhhhhhh
>
> I designed what I felt was an aesthetically nice set of pages, I honed

them
> down to what I felt was near perfection from a pleasing design point of
> view - good old IE5.5, looks wonderful.
>
> Then I showed one of my mates at work and almost fell off my chair, in

IE6.0
> it looks awful! How can this be !!! why do the ribbons no longer look
> correct - the left hand ribbon is infact the page background, the "main"
> ribbon is a div set to 100% height so it "should" reach the bottom of any
> page and effectively block out the background. this works nicely in IE5.5
> but it's an ugly mess in IE6.0 which is like an "L"
>
> Can anyone shed some light on where I'm going wrong please, I'm new to

this
> CSS stuff and I thought I'd made quite a good job - seems I've not really!
> Better not give up the day job yet eh!


> http://www.theleonardfamily.co.uk/cssmenu/menuintro.htm


Your design is relying on certain bugs to be found in IE5.x. IE6 does not
have these bugs (unless you run it in quirks mode). Neither do any of the
other browsers.

Specifically IE5.x stuffs up the width of an element by including the
margins etc. IE6 does not.

<grin>
Several major problems with your design:
</grin>

Absolutely positioned elements. This is fine for the nav bar and the top div
but not for that one with the form. You don't know how big the top div is so
you don't know where to position the form div. In my case when I make my
font larger the top div's text runs underneath the form.

You specify width's of things in %. This means, as I change my canvas width
things get narowwer. At certain combinations of canvas width and font size
the nav bar text gets disappeared.

This is a standard two column layout. This has been done and discussed so
many times before that there is almost a "standard" way of doing it.

You have a nav bar, in a ul. Float the ul to the left and give it a width
(pixels are indicated here as you wish it to fit into a brown background).
Don't wrap it in lots of divs, apply the style directly to the ul element.

The rest of the content lives in a div with a left margin set so the left of
the content aligns vertically to the right of the nav bar. If you don't do
this the content will flow underneath the nav bar.

You will have to jump through all sorts of hoops to get that brown column
down the left side of the page. Height works quite differently once you
remove IE5.x from the equation

The general consensus is that you should simulate the brown column with a
two coloured background applied to the body and just let the other elements
end where they want to.

Easier to visualise all of this with a picture:

http://users.bigpond.net.au/rf/test/chris/

The KISS principle has been firmly applied. Season to taste.

Cheers
Richard.


 
Reply With Quote
 
Chris Leonard
Guest
Posts: n/a
 
      09-26-2003
Richard.

Thanks very much. I appreciate your taking the time out to do what you did,
it's a great help. My wife adds her thanks as well ....... she says she
likes me with all my hair and pulling it out was not the answer!

Chris


 
Reply With Quote
 
 
 
Reply

Thread Tools

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is On
HTML code is Off
Trackbacks are On
Pingbacks are On
Refbacks are Off


Similar Threads
Thread Thread Starter Forum Replies Last Post
DEVELOP THE WINNING EDGE, SMALL DIFFERENCES IN YOUR PERFORMANCE CANLEAD TO LARGE DIFFERENCES IN YOUR RESULTS Home_Job_opportunity C Programming 0 01-14-2009 03:51 PM
DEVELOP THE WINNING EDGE, SMALL DIFFERENCES IN YOUR PERFORMANCE CANLEAD TO LARGE DIFFERENCES IN YOUR RESULTS Home_Job_opportunity C Programming 0 01-08-2009 04:31 PM
Browser Differences SStory ASP .Net 7 03-29-2006 01:23 PM
Browser Differences Yama ASP .Net 1 11-10-2005 12:44 PM
Differences between running in VS and calling an ASP.Net page froma browser Peter Bradley ASP .Net 2 07-16-2003 05:59 PM



Advertisments