Different Browsers show different layout?

andymaung · August 6th, 2004, 1:10 PM

If you go to my website, you will see a Cross Browser marquee and below it there is a search box.

The Cross Browser marquee is set for center aligned and Search box is set for right aligned.
If you browse with MS Internet Explorer, there is correct display.
But with Opera, the search box is changed to center aligned.
With NetScape, The marequee shows only half frame and the search box is also aligned to center.

I am very much confused of this matter. Do you have any idea or can tell me what's wrong with this?

Thanks and appreciated.

VTJustinB · August 6th, 2004, 1:49 PM

Certain browsers will render pages differently because they have different interpretations of what defaults should be. The best way to avoid this is to explicitly state how things should be flowed and aligned to ensure that all browsers are forced into the same schema.

I'd be willing to guess that the reason netscape is displaying differently is because the script uses DHTML (a late-90s technology) which is implemented completely differently on both IE and Netscape and this script tries to accomidate both. It is probably just a shortcomming of the script.

As far as your search box goes, your HTML is structurally invalid. You wanted to push it to the right by setting a containing paragraph's tag align to right, but the paragraph tag was never even closed out (so when does the browser know to stop aligning right? This error might cause some browsers to ignore the declaration entirely). I wouldn't recommend this approach (with paragraph tags) anyway since using HTML to achieve purely presentational effects is generally a bad practice.

You'd probably want to put a width:100%; and text-align:right; in a css declaration for the form tag to push all of the input elements flush right.

And if that scroller is absolutely necessary I would consider either using the DOM in lew of the old DHTML stuff or flash.

And when in doubt about why something isn't displaying right, validate your code. If you're not offering syntactically correct HTML there's no saying what each browser will actually produce with the broken code.

Justin

andymaung · August 6th, 2004, 2:10 PM

Many thanks for your explanation VTJustinB.
I would like to use such Cross Browser marquee to diplay logos as you see and pause when mouse over it then click to go to the link.

I much appreciated if you could advise me one good and easy script to use for this.

Thanks again.

VTJustinB · August 6th, 2004, 4:38 PM

http://www.widomaker.com/~reboughner...er/scroll.html

August 6th, 2004, 1:10 PM	#1 (permalink)
andymaung Registered User Comfy Contributor Joined in Apr 2004 Lives in Asia Hosted on Sky 123 posts Gave thanks: 0 Thanked 0 times	Different Browsers show different layout? If you go to my website, you will see a Cross Browser marquee and below it there is a search box. The Cross Browser marquee is set for center aligned and Search box is set for right aligned. If you browse with MS Internet Explorer, there is correct display. But with Opera, the search box is changed to center aligned. With NetScape, The marequee shows only half frame and the search box is also aligned to center. I am very much confused of this matter. Do you have any idea or can tell me what's wrong with this? Thanks and appreciated.

August 6th, 2004, 1:49 PM	#2 (permalink)
VTJustinB Registered User Seasoned Poster Joined in Jul 2003 Lives in Research Triangle Park, NC / Blacksburg, VA 57 posts Gave thanks: 0 Thanked 0 times	Certain browsers will render pages differently because they have different interpretations of what defaults should be. The best way to avoid this is to explicitly state how things should be flowed and aligned to ensure that all browsers are forced into the same schema. I'd be willing to guess that the reason netscape is displaying differently is because the script uses DHTML (a late-90s technology) which is implemented completely differently on both IE and Netscape and this script tries to accomidate both. It is probably just a shortcomming of the script. As far as your search box goes, your HTML is structurally invalid. You wanted to push it to the right by setting a containing paragraph's tag align to right, but the paragraph tag was never even closed out (so when does the browser know to stop aligning right? This error might cause some browsers to ignore the declaration entirely). I wouldn't recommend this approach (with paragraph tags) anyway since using HTML to achieve purely presentational effects is generally a bad practice. You'd probably want to put a width:100%; and text-align:right; in a css declaration for the form tag to push all of the input elements flush right. And if that scroller is absolutely necessary I would consider either using the DOM in lew of the old DHTML stuff or flash. And when in doubt about why something isn't displaying right, validate your code. If you're not offering syntactically correct HTML there's no saying what each browser will actually produce with the broken code. Justin __________________ "I tried to go to Target but I missed" ~Mitch

August 6th, 2004, 4:38 PM	#4 (permalink)
VTJustinB Registered User Seasoned Poster Joined in Jul 2003 Lives in Research Triangle Park, NC / Blacksburg, VA 57 posts Gave thanks: 0 Thanked 0 times	http://www.widomaker.com/~reboughner...er/scroll.html __________________ "I tried to go to Target but I missed" ~Mitch

Thread Tools	Search this Thread
Show Printable Version Email this Page	Search this Thread: Advanced Search
Rate This Thread
Rate This Thread:

August 6th, 2004, 2:10 PM	#3 (permalink)
andymaung Registered User Comfy Contributor Joined in Apr 2004 Lives in Asia Hosted on Sky 123 posts Gave thanks: 0 Thanked 0 times	Many thanks for your explanation VTJustinB. I would like to use such Cross Browser marquee to diplay logos as you see and pause when mouse over it then click to go to the link. I much appreciated if you could advise me one good and easy script to use for this. Thanks again.

Currently Active Users Viewing This Thread: 1 (0 members and 1 guests)