Web Page Displaying Different in Firefox & IE7

[Paul B]

Hi all

I'm designing a website for my sister-in-law but when I view it in Firefox 3 & IE7 it looks different.

In Firefox 3 it displays exactly how I want it to look but when I view it in IE7 the text seems larger and puts part of the page out of proportion.

Does anyone know if there is a way that I can get the page to display the same in both Firefox 3 & IE7

Thanks in advance

Paul

 

[voodish]

Hey Paul, welcome to the forum.

Without seeing the code, it's pretty difficult to say what the problem is, can you post a link to the webpage / website?

 

[Paul B]

Would I be able to attach an html file to a message? If I can then I could attach the webpage to next message. If not I'll post the link to the site

OK, here's the link to the site

http://www.sapphire-import-export.co.uk/

 

[voodish]

Probably best to supply a link if poss.

 

[Paul B]

http://www.sapphire-import-export.co.uk/

 

[voodish]

Cheers - the site looks the same for me in FF and IE7

I have sent it to Browsershots for a complete browser check:
http://browsershots.org/http://www.sapphire-import-export.co.uk/
Give it a few minutes to load up.

Could it be possible that in IE7 the View>Text Size is set to higher value than in FF?

 

[Paul B]

ok thanks, still waiting for IE7 screenshot

 

[Paul B]

ok, look at the header in firefox were its says "A Young Company With Modern Views" and then look at the same text in IE7. The word "Views" has dropped down to the send line.

 

[voodish]

IE is needing a little more clearance within the cell to display the text, so it is pushing the text to the next line - increase the TD width and you will give it the room it requires.

I would make it a % width rather than a fixed width, so that the cell can grow based on the size of the screen.
______________________________________
Ideally, we shouldn't be using tables for layout.

 

[Paul B]

OK, done a bit of tweaking but IE7 seems to be displaying the text (Font) in a larger size

 

[voodish]

Disclaimer: I don't really endorse using this type of code, because it really is an old fashion way of coding and creates more problems than it solves, but let's see if it works.


Where you have:

<td height="1" width="286">
<div style="text-align: center;"><big><font color="#000000"><font style="font-size: 8pt;" size="1"><big><b>A
YOUNG COMPANY WITH MODERN VIEWS</b></big></font></font></big></div>

Replace with

<td width="300">
<div align="center"><span style="font-size: 12px; color: #000000; font-weight: bold">A YOUNG COMPANY WITH MODERN VIEWS</span></div>

 

[Paul B]

Sorry but I have another question regarding my website.

We want to put a part of "Declaration of Human Rights" on the webpage but the person I'm designing it for says the box I've put the wording in is far too big. I've explained to this person that I can't make the box any smaller without making the text too small to read but they won't have it LOL.

I was thinking about putting it in a box that can be scrolled. I've seen them on sites where they've put "Terms & Conditions" in what looks like a form box which you can scroll but I can't figure out how to do this.

Regards
Paul

 

[zkiller]

What you are thinking of is simple as...

<textarea>Your text here.</textarea>

But I think you would be better off using a regular div, setting a fixed height and width for it and finally making it scrollable by applying overflow: scroll; to it.

 

[conor]

in regards to the web page diaplay problem in ie7, it could be to do with the ie7 font size settings locally on your computer. Try setting a standard font size across the whole site

body{
font-size:10px;
}