|
| |
|
|
Bruce2000
Posts: 146
From: Huntsville AL USA
Status: offline
 |
CSS Differences Between Firefox and IE6 - 1/19/2007 14:46:32
I created my first page using nearly all CSS for my formatting while content still sits in html tables and have one issue. it looks ok in Frontpage, and on IE6, but in Firefox the vertical height or padding of some cells is messed up. Here is the page.
I was able to tweak the very top line of my text so it is off the header bar by increasing padding, but it still looks different between the 2 browsers. I did not do any fix to the footer as you can see. What can be wrong?
Also: my page requires scrolling horizontally when in 800x600 screens, but I think that is how it has to be because the header and footer graphics bar was made 1002px wide so even though I made the table 100% it's not going to be less than 1002 wide.....is that correct? I cant think of any way that it would be able to shrink to fit a smaller window. Besides, don't most people today use 1024x768 monitors anyway?
Bruce
|
|
|
|
Tailslide
Posts: 5912
Joined: 5/10/2005
From: Out here on the raggedy edge
Status: offline
|
RE: CSS Differences Between Firefox and IE6 - 1/19/2007 15:05:58
Doesn't look a lot different to me to be honest.
As far as screen resolutions go - it depends on your audience. In the last 3 months 3 of my clients have had large screens but low resolutions (last one was yesterday). If you're aiming at a high tech audience then they may well be using wide screens and high resolution - but there's no guarantee that they have their browser windows maximised anyway.
Personally I'd either go for a width that works in 800px or I'd go for an elastic or fluid design. I wouldn't consider going for a fixed layout wider than 760px.
There's no way you can make the header and footer fit unless you make one of them a background image on the body element and get rid of the other or change it's width to a maximum of around 760px.
_____________________________
"My strategy is so simple an idiot could have devised it"
Little Blue Plane Web Design | Blood, Sweat & Rust - A Land Rover restoration project
| |
|
|
|
Bruce2000
Posts: 146
From: Huntsville AL USA
Status: offline
|
RE: CSS Differences Between Firefox and IE6 - 1/19/2007 15:47:08
On my example page, look at the footer bar where the copyright and counter is. There's a good difference between FF and IE.
If I make the header bar as a background then part of it will be cut off on an 800 browser, right? How would an elastic/fluid design work with a 1002px image? Would it actually shrink the image?
Bruce
| |
|
|
|
Tailslide
Posts: 5912
Joined: 5/10/2005
From: Out here on the raggedy edge
Status: offline
|
RE: CSS Differences Between Firefox and IE6 - 1/19/2007 15:53:04
Yes the image would be cut off at less than 800px and no you can't stretch a fixed image.
The only other choice is to take a selection of the banner pattern that you can repeat on the y-axis across the top of the page. Put that on the body as the background image repeated horizontally. Then pick the images (cars, aircraft etc) and have them in the markup placed on top of the background image as separate images.
I'm afraid it's not terribly helpful as you'd need quite a rethink of your page structure!
_____________________________
"My strategy is so simple an idiot could have devised it"
Little Blue Plane Web Design | Blood, Sweat & Rust - A Land Rover restoration project
| |
|
|
|
Bruce2000
Posts: 146
From: Huntsville AL USA
Status: offline
|
RE: CSS Differences Between Firefox and IE6 - 1/19/2007 18:05:55
quote:
ORIGINAL: Tailslide
I'm afraid it's not terribly helpful as you'd need quite a rethink of your page structure!
How about this: I can make a second version of that bar image, 800 wide, and in the html if I could put something like if screen width = 800 use image B But I'm not sure if browsers can detect the user's screen res?
Bruce
| |
|
|
|
Bruce2000
Posts: 146
From: Huntsville AL USA
Status: offline
|
RE: CSS Differences Between Firefox and IE6 - 1/19/2007 23:09:37
Ok, going back to the original issue - my page looks different in Firefox and IE. I started another new page from scratch, and only got as far as the block of text in the right main cell when I previewed it and it is already different. i also started a new style sheet so not to carry over any bad style commands. My regular site that is online views the same in both browsers, so something is up with the css or the table. I dont know what could be wrong.
| |
|
|
|
Tailslide
Posts: 5912
Joined: 5/10/2005
From: Out here on the raggedy edge
Status: offline
|
RE: CSS Differences Between Firefox and IE6 - 1/20/2007 3:31:59
If you really want your site to work cross-browser then you need to firstly, use a complete DOCTYPE (which you are on your current site) and then use Firefox to test your site in rather than IE6. Then fix for IE rather than trying to do it the other way around.
The reason for doing this is that Firefox interprets the code in a stricter fashion than IE6 does - so if you're coding for IE6 you're more likely to run into problems with Firefox, Opera, Safari, Camino etc etc.
If your site looks fine in Firefox then it probably looks ok in the other "good" browsers (even IE7) and it will be easier to apply the standard IE6 < fixes for the various bugs and general incompetence that infest it.
_____________________________
"My strategy is so simple an idiot could have devised it"
Little Blue Plane Web Design | Blood, Sweat & Rust - A Land Rover restoration project
| |
|
|
|
Bruce2000
Posts: 146
From: Huntsville AL USA
Status: offline
|
RE: CSS Differences Between Firefox and IE6 - 1/20/2007 3:56:07
Ok...I figured out finally what the problem was. Or seems to have been! It had something to do with using margin and padding to get the header bar links to the right spot. I made a division, and used absolute positioning and that worked...as for the bottom, there was some problem with the cell margins - I did so many different things that I'm not quite sure what fixed it - but I opened it on both browsers and they are nearly identical in every respect.
the other pages on my site are way more complicated than this one - it'll be a miracle if I can do it.
| |
|
 New Messages |
 No New Messages |
 Hot Topic w/ New Messages |
 Hot Topic w/o New Messages |
 Locked w/ New Messages |
 Locked w/o New Messages |
|
Post New Thread
Reply to Message
Post New Poll
Submit Vote
Delete My Own Post
Delete My Own Thread
Rate Posts
|
|
|
Printable Version 
). 
