473,545 Members | 2,688 Online
Bytes | Software Development & Data Engineering Community
+ Post

Home Posts Topics Members FAQ

Help required - browser compatibility problems

Hi folks,

I'm working on a site using css-p for all the layout and rollovers etc.

I've hit a bit of a brick wall with a couple of elements though and thought
someone here could help me out.

Test page is available at http://www.aoov50.dsl.pipex.com/flowers/test.htm

I've included all the css as inline rather than linked so the source code
should be pretty easy to view.

The navigation buttons (top right) look fine in the windows versions of
Netscape (7.1) and Mozilla Firefox but a complete dogs dinner in IE6.

Also, I've had to put a pixel width on one item, #header width: 298px;
which leaves a 2 pixel gap on the right hand side in NS/MF but looks dandy
in IE6. It _should_ be 300px to make it fit but setting this value throws
everything completely awry in IE6.

For best results should I use seperate stylesheets and browser detect
scripts? I was rather hoping to do away with scripting altogether so I'd
prefer not to have to go down this path but if needs must..

Many thanks in advance for your assistance,

Mik Foggin

--
'Reality,' sa molesworth 2, 'is so unspeakably sordid it make me shudder.'
Jul 20 '05 #1
4 2079
Mik Foggin <mi**@dsl.pipex .com> wrote in message news:<Xn******* *************@1 95.129.110.205> ...
Hi folks,

I'm working on a site using css-p for all the layout and rollovers etc.

I've hit a bit of a brick wall with a couple of elements though and thought
someone here could help me out.

Test page is available at http://www.aoov50.dsl.pipex.com/flowers/test.htm

I've included all the css as inline rather than linked so the source code
should be pretty easy to view.

The navigation buttons (top right) look fine in the windows versions of
Netscape (7.1) and Mozilla Firefox but a complete dogs dinner in IE6.

Also, I've had to put a pixel width on one item, #header width: 298px;
which leaves a 2 pixel gap on the right hand side in NS/MF but looks dandy
in IE6. It _should_ be 300px to make it fit but setting this value throws
everything completely awry in IE6.

For best results should I use seperate stylesheets and browser detect
scripts? I was rather hoping to do away with scripting altogether so I'd
prefer not to have to go down this path but if needs must..

Many thanks in advance for your assistance,

Mik Foggin


I've been doing some more digging around and ended up screen dumping
various browser screens into Photoshop and comparing pixel sizes.

It appears to me that I'm falling foul of the 'Box Model' problem
which is confusing me as I'm using IE6 and I thought that this
correctly implemented the width/border/padding issue?

eg, the 'title' div tag has a width of 770px with a 1px solid border
and no padding.

If I screen sump from Firefox and NN7.1 the rendered title block has a
width of 772px (1px + 0px + 770px + 0px +1px) wheras IE6 is deplaying
the title block as 770px wide (1px + 0px +668px +0px +1px)

This is the further thrown by some other div elements with borders
within the title.

Have I completely misunderstood the box model issue and do I resolve
this using the Tantek hack or something similar?

Any response to this would be most appreciated.

Thanks,

Mik Foggin
Jul 20 '05 #2
mf*****@my-deja.com (Michael Foggin) wrote:
Mik Foggin <mi**@dsl.pipex .com> wrote in message news:<Xn******* *************@1 95.129.110.205> ...

Test page is available at http://www.aoov50.dsl.pipex.com/flowers/test.htm

It appears to me that I'm falling foul of the 'Box Model' problem
which is confusing me as I'm using IE6 and I thought that this
correctly implemented the width/border/padding issue?


IE6 has two rendering modes. In quirks mode it uses the old, broken
box model. In standards mode it uses the correct box model. Which mode
is used is determined by the doctype used in the document. Your
doctype triggers standards mode. But... IE only looks for a doctype on
the first non-empty line of the document, so you xml declaration
throws it into quirks mode instead. Getting rid of the xml declaration
is the easiest solution.

Steve

--
"My theories appal you, my heresies outrage you,
I never answer letters and you don't like my tie." - The Doctor

Steve Pugh <st***@pugh.net > <http://steve.pugh.net/>
Jul 20 '05 #3
Steve Pugh <st***@pugh.net > wrote in message news:<6c******* *************** **********@4ax. com>...
IE6 has two rendering modes. In quirks mode it uses the old, broken
box model. In standards mode it uses the correct box model. Which mode
is used is determined by the doctype used in the document. Your
doctype triggers standards mode. But... IE only looks for a doctype on
the first non-empty line of the document, so you xml declaration
throws it into quirks mode instead. Getting rid of the xml declaration
is the easiest solution.

Steve


Steve,

many thanks! all becomes clear(ish).

I'll still need to tweak the css to make it work with IE5.x but at
least I can stop pulling my hair out over IE6.

Cheers,

Mik Foggin
Jul 20 '05 #4
Steve Pugh <st***@pugh.net > wrote in message news:<6c******* *************** **********@4ax. com>...
IE6 has two rendering modes. In quirks mode it uses the old, broken
box model. In standards mode it uses the correct box model. Which mode
is used is determined by the doctype used in the document. Your
doctype triggers standards mode. But... IE only looks for a doctype on
the first non-empty line of the document, so you xml declaration
throws it into quirks mode instead. Getting rid of the xml declaration
is the easiest solution.

Steve


Steve,

many thanks! all becomes clear(ish).

I'll still need to tweak the css to make it work with IE5.x but at
least I can stop pulling my hair out over IE6.

Cheers,

Mik Foggin
Jul 20 '05 #5

This thread has been closed and replies have been disabled. Please start a new discussion.

Similar topics

33
3417
by: Mark Tranchant | last post by:
My site now uses Apache MultiViews and some PHP code to determine whether your browser can handle the application/xhtml+xml media type. If it does, the document is sent with that content type and the XHTML 1.1 DOCTYPE. If not, it is sent as text/html and the XHTML 1.0 DOCTYPE. Details of how this is achieved and the problems solved en...
3
2493
by: Kevin Matthews | last post by:
i'm having strange problems with browser compatibility between firefox and internet explorer, ---------------------------------------- The following is the CSS: ---------------------------------------- body { font-family: Verdana, Arial, Helvetica, Sans-serif; font-size: 80%; background-color: #FFFFFF;
7
1965
by: Trvl Orm | last post by:
I am working with 2 frames, Left and Right and the main code is in the left frame, which has been attached. Can someone please help me with this code. I am new to JavaScript and can't figure it out. What needs to happen is this: On the left frame you should have a series of buttons, which when pushed makes things happen on the right...
8
3366
by: DKM | last post by:
Here are the source code files to a Java applet that utilizes LiveConnect to communicate with Javascript, and the HTML file. The thing works both in IE 6.0 and FireFox 1.4. but with some problems. IE crashes when one refreshes the page or leave the page. This happens only after calling the Java method more than once. It does not crash if...
8
5455
by: baustin75 | last post by:
Posted: Mon Oct 03, 2005 1:41 pm Post subject: cannot mail() in ie only when debugging in php designer 2005 -------------------------------------------------------------------------------- Hello, I have a very simple problem but cannot seem to figure it out. I have a very simple php script that sends a test email to myself. When I...
23
3120
by: gregf | last post by:
I have a paragraph of text pasted into a word document, it's in Polish, complete with polish characters. They show up just fine in word, but the program I use for web page programming, HomeSite, won't translate it. When I paste the text into the code, the special characters are missing. If they would show up there I could use the Replace...
19
3297
by: Ganesh J. Acharya | last post by:
Hi there, I want to redesign my website and make that look professional. I made this about 6 years ago with very little knowledge of internet. Today I am getting about 4000 visitors a day for the same. What are the things I need to keep in my mind when doing this process.
53
8332
by: souporpower | last post by:
Hello All I am trying to activate a link using Jquery. Here is my code; <html> <head> <script type="text/javascript" src="../../resources/js/ jquery-1.2.6.js"</script> <script language="javascript" type="text/javascript">
0
7502
marktang
by: marktang | last post by:
ONU (Optical Network Unit) is one of the key components for providing high-speed Internet services. Its primary function is to act as an endpoint device located at the user's premises. However, people are often confused as to whether an ONU can Work As a Router. In this blog post, we’ll explore What is ONU, What Is Router, ONU & Router’s main...
0
7434
by: Hystou | last post by:
Most computers default to English, but sometimes we require a different language, especially when relocating. Forgot to request a specific language before your computer shipped? No problem! You can effortlessly switch the default language on Windows 10 without reinstalling. I'll walk you through it. First, let's disable language...
0
7946
jinu1996
by: jinu1996 | last post by:
In today's digital age, having a compelling online presence is paramount for businesses aiming to thrive in a competitive landscape. At the heart of this digital strategy lies an intricately woven tapestry of website design and digital marketing. It's not merely about having a website; it's about crafting an immersive digital experience that...
1
7457
by: Hystou | last post by:
Overview: Windows 11 and 10 have less user interface control over operating system update behaviour than previous versions of Windows. In Windows 11 and 10, there is no way to turn off the Windows Update option using the Control Panel or Settings app; it automatically checks for updates and installs any it finds, whether you like it or not. For...
0
6026
agi2029
by: agi2029 | last post by:
Let's talk about the concept of autonomous AI software engineers and no-code agents. These AIs are designed to manage the entire lifecycle of a software development project—planning, coding, testing, and deployment—without human intervention. Imagine an AI that can take a project description, break it down, write the code, debug it, and then...
1
5360
isladogs
by: isladogs | last post by:
The next Access Europe User Group meeting will be on Wednesday 1 May 2024 starting at 18:00 UK time (6PM UTC+1) and finishing by 19:30 (7.30PM). In this session, we are pleased to welcome a new presenter, Adolph Dupré who will be discussing some powerful techniques for using class modules. He will explain when you may want to use classes...
0
3491
by: TSSRALBI | last post by:
Hello I'm a network technician in training and I need your help. I am currently learning how to create and manage the different types of VPNs and I have a question about LAN-to-LAN VPNs. The last exercise I practiced was to create a LAN-to-LAN VPN between two Pfsense firewalls, by using IPSEC protocols. I succeeded, with both firewalls in...
1
1921
by: 6302768590 | last post by:
Hai team i want code for transfer the data from one system to another through IP address by using C# our system has to for every 5mins then we have to update the data what the data is updated we have to send another system
0
744
bsmnconsultancy
by: bsmnconsultancy | last post by:
In today's digital era, a well-designed website is crucial for businesses looking to succeed. Whether you're a small business owner or a large corporation in Toronto, having a strong online presence can significantly impact your brand's success. BSMN Consultancy, a leader in Website Development in Toronto offers valuable insights into creating...

By using Bytes.com and it's services, you agree to our Privacy Policy and Terms of Use.

To disable or enable advertisements and analytics tracking please visit the manage ads & tracking page.