The Mozilla & IE Problem

webnitro · November 30th, 2005, 03:52 AM

This has long been puzzleing me, but is there any way to format webpages so they look the same in mozilla firefox as they do in IE, here are my 2 examples

IE http://tinyurl.com/9zaks
Mozilla http://tinyurl.com/ddw7k

as you can see the line spaceings in IE are alot bigger, so it cuts of the rest of the page.

cheers for any help.

ChrisScott · December 1st, 2005, 06:59 AM

Impossible to tell from a screen shot.

Can you post your code?

Cheers,

Chris

crmpicco · December 1st, 2005, 08:16 AM

when i was attempting to do this i noticed the use of CSS helped

www.crmpicco.co.uk

meow · December 1st, 2005, 05:49 PM

You mean like this?

http://foo.yupapa.com/wrox/ie.gif

--
http://yupapa.com

webnitro · December 3rd, 2005, 09:49 AM

dont realy know CSS, and a bit of screen shot editing dosent realy help meow but yes thats how i want it to look in IE, but it dosent because it seems like IE uses diffrent mesurments for <p></p> than mozilla

this is the code, ive validated it at w3.org so its all fine in that respect

html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>USA Show Air Dates</title>
<style type="text/css">

</style>
</head>

<body>
<table width="100%" border="0" align="center">
  <tr>
    <td width="100%" bgcolor="#6C8AFF"><div align="center"><span class="style5">Search term: <strong>stargate</strong></span></div></td>

  </tr>
</table>
<p align="left" class="style1">Show: <span class="style3">Stargate SG-1
</span></p>
<p align="left" class="style1">First Aird: <span class="style3">1997
</span></p>
<p align="left" class="style1">Last Episode: <span class="style3">09x10, "The Fourth Horseman (1)" aird on 16/Sep/2005
</span></p>
<p align="left" class="style1">Next Episode: <span class="style3">09x11, "The Fourth Horseman (2)" airing on 13/Jan/2006
</span></p>
<div align="right">
  <input name="Close" type="button" onClick="javascript:window.close()" value="Close">

</div>
<table width="100%" border="0" align="center">
  <tr>
    <td width="100%" bgcolor="#6C8AFF" class="style5"><div align="center">End</div></td>
  </tr>
</table>
</body>
</html>

webnitro · December 6th, 2005, 05:17 AM

did some looking into CSS, and yea your right, can set the paragraph spaceings and stuff

easyest way would just be to put the lines into a table

meow · December 6th, 2005, 05:32 AM

Quote:

quote:a bit of screen shot editing dosent realy help meow

My point exactly. :D
Sorry, but I was joking because you posted a screen cap instead of a URL. ;)

You don't need another table. You don't even need the first one. Control the margins. If I remember right from your screen shot you had disabled resizing of the pop-up. That is a bigger problem. Because the window will be too small for the text if the user increases the text size and then they can't read all of the text.

--
http://yupapa.com

Dj Kat · January 3rd, 2006, 09:54 AM

have you tried using !important in your css.

example:
/*css style*/
border: 1px solid ThreeDShadow !important;/*only firefox will read this */

__________________________________________________ ________
This is my junk I'm gona eat it

ceadge · January 19th, 2006, 09:30 PM

Try defining the margins etc in a general CSS rule for paragraphs, along these lines:

p {
margin-top: 10px;
margin-bottom: 10px;
padding: 5px;
line-height: 1.6em;
}

I don't know for sure if it will iron out the differences, but it is what I would try in the same situ.