pages are ok on IE but not on FF2 (Full Version)

All Forums >> [Web Development] >> Expression Web Help



Message

yellowbird -> pages are ok on IE but not on FF2 (12/28/2007 10:12:10)

First of all greetings to all, this is my first posting. Secondly I am new at creating web pages. Yes, I suppose you can call me a newbie, lol. Now, I will try and explain my situation. I have created 2 sites before installing SP1 and these pages looks fine on both browsers. Now this 3rd one the pages do appear correct on IE but quite different on FF2. I have validated my CSS and HTML files and no errors found. I have read many posts on this forum as well as others and i have made a few corrections, i.e. I changed the Doctype, and also the character set, as it was suggested and no results. I have uploaded my pages to a temporary server.

This is the url; http://www.herb-al-remedies.com/fredd

Once you have open the site on FF and if you have the add-ons you may view my css and html files. Otherwise i will have to learn how to post them.

Thanking you in advance

Ron



jaybee -> RE: pages are ok on IE but not on FF2 (12/28/2007 10:22:02)

Welcome Ron. Hang on and I'll take a look.



jaybee -> RE: pages are ok on IE but not on FF2 (12/28/2007 10:42:06)

After a quick play around, it's this that's causing the problem in Firefox. If you take out the comma between header and h1 you'll see what I mean. I haven't got time to play around with it now but I suspect it's due to the cascade and another rule is adding more padding at the top.

If it's any help, if you can get it right in Firefox then it'll be right in the other browsers. IE is a law unto itself. 

#header, h1 {
	text-align: right;
	padding-right: 20px;
	font-family: "Imprint MT Shadow";
	font-size: 80px;
}



caz -> RE: pages are ok on IE but not on FF2 (12/28/2007 11:38:27)

You also have a couple of typos in the CSS , you missed the n off leftcolumn 

#leftcolum {
	font: medium Arial, Helvetica, sans-serif;
	height: auto;
	float : left;
	width : 150px;
	margin: 10px 10px 10px 10px;
	padding: 10px 0 20px 20px;
	background-color: #FFFFFF;
}
#leftcolum a:hover, #wrapper a:hover {
	color:orange;
}


This doesn't put it right - sorry but it is a start. [;)]



jaybee -> RE: pages are ok on IE but not on FF2 (12/28/2007 12:08:43)

Thinking about it, if you look in your code you don't have a H1 so whatever you meant that style for doesn't apply to anything. I suspect that you've somehow managed to change it to a Paragraph.



yellowbird -> RE: pages are ok on IE but not on FF2 (12/28/2007 12:36:00)

Thanks for your prompt reply. You were right, I had changed the h1 for a p which i have corrected along with removing the coma, and yet nothing as changed.



yellowbird -> RE: pages are ok on IE but not on FF2 (12/28/2007 12:39:41)

Reference to the typo, they were the same in both files so it did not matter, but i have corrected them anyway, again nothing changed



jaybee -> RE: pages are ok on IE but not on FF2 (12/28/2007 12:48:22)

Then you need to play around with that #header, h1 in the style sheet and anything above that which cascades down.



yellowbird -> RE: pages are ok on IE but not on FF2 (12/28/2007 12:53:00)

Yes, that is what i am working on right now, thanks again and will let you know



jaybee -> RE: pages are ok on IE but not on FF2 (12/28/2007 12:57:57)

I also found that if I took the float:left out on the image then the header went to the top.



womble -> RE: pages are ok on IE but not on FF2 (12/28/2007 14:30:52)

The MRI and X-ray bookmarkets that someone (Tailslide?) posted recently may help out here and show how the cascade's affecting the various page elements - might be worth a try. As Jaybee said though, if you can get it working right in Firefox, it'll work in other browsers, though IE may require a bit of a tweak (I've renamed the IE icon on my computer to 'Incompetent Explorer' [:D])



d a v e -> RE: pages are ok on IE but not on FF2 (12/28/2007 15:29:56)

"MRI and X-ray bookmarkets" ooh yes miss that was me! :)



womble -> RE: pages are ok on IE but not on FF2 (12/28/2007 16:35:48)

Sorry Dave - I was a little preoccupied with matters medical at the time and it seemed like the sort of goodies Tail posts. I do humbly apologise. [sm=bowdown.gif]



d a v e -> RE: pages are ok on IE but not on FF2 (12/28/2007 17:02:51)

yellowbird - you need to save your globe background as a jpeg from your original image - that gif is far too big at 775k! :)



yellowbird -> RE: pages are ok on IE but not on FF2 (12/28/2007 17:59:16)

response to Dave...a jpg will be twice as large...over 1 meg



jaybee -> RE: pages are ok on IE but not on FF2 (12/28/2007 18:15:44)

I got this one down to just over 72k using photoshop. The small text isn't sharp but it's only for a background and most of it's covered. Help yourself. If you need it made larger shout if you don't have Photoshop.

[image]local://upfiles/9075/AE962F0BBB584D57813D80326D498220.jpg[/image]



yellowbird -> RE: pages are ok on IE but not on FF2 (12/28/2007 18:23:23)

response to jaybee.... when i remove the float:left on the image, it slides over to the right and the name moves down.



jaybee -> RE: pages are ok on IE but not on FF2 (12/28/2007 18:42:01)

In Firefox it centres and lifts the header to the top of the page. Yes the text shifts but it will do as it can't fit to the right of the image.

How well do you understand css? You need to look at the entire header area and work out how the cascade is affecting the contents and then re-jig it.

When you're building a new site build it for Firefox not IE.



d a v e -> RE: pages are ok on IE but not on FF2 (12/29/2007 2:33:10)

"response to Dave...a jpg will be twice as large...over 1 meg" then you're doing it wrong then :)



womble -> RE: pages are ok on IE but not on FF2 (12/29/2007 5:46:56)

Probably what Dave meant to say is that you need to experiment with the compression and resolution to get a balance between an acceptable quality and an acceptable size for images. [;)]

In general gifs tend to be more appropriate where you're got large blocks of colour on a limited colour palette. jpgs tend to to be more appropriate for photographic images or when you've got a large range of colours and subtle variations in shades.



jaybee -> RE: pages are ok on IE but not on FF2 (12/29/2007 6:34:16)

Scuse me but isn't this a bit irrelevant? I posted the image above sized to 72k. It's about the only thing I can do on the Mac as I don't have any software to play around with page layouts.



yellowbird -> RE: pages are ok on IE but not on FF2 (12/29/2007 9:10:32)

to jaybee....thanks for your input and for the img. I do have photoshop but I have a lot to learn with it. I have been using Expression Web for the last couple of years, and know a bit of CSS, but like everything else there are a lot to learn.
I will remember to built my pages for FF2 from now on.

Thanks again

Ron



jaybee -> RE: pages are ok on IE but not on FF2 (12/29/2007 9:21:04)

Use the "Save for Web" feature in Photoshop. In the right column you can change the image size, apply it then change file types, colour depth and quality. Each time you make a change the resulting file size will appear underneath the image in the main area so you can judge quality vs size.



d a v e -> RE: pages are ok on IE but not on FF2 (12/29/2007 11:18:16)

"Scuse me but isn't this a bit irrelevant?" oops sorry [:)]



rdouglass -> RE: pages are ok on IE but not on FF2 (12/29/2007 11:48:52)

quote:

#header, h1 {


Back to that.

If I could suggest just switching the order of those two. It's just a guess but I do remember that in CSS and the 'priority' of things, an element (<h1>) is 'above' and id (#).

h1, #header {

Again, just a guess but I've seen stranger things. </$.02>



yellowbird -> RE: pages are ok on IE but not on FF2 (12/31/2007 11:05:21)

To Jaybee and others that volunteer to help me out with my problem. I was able to correct my errors by deleting "p" and "h1" in the "div" in my "htm" pages. Then I edited the "header" in the CSS page. Now my site looks the same on both browser.

Thanks again and a Happy New Year to all

Ron



jaybee -> RE: pages are ok on IE but not on FF2 (12/31/2007 12:01:18)

Well done!



Page: [1]

Valid CSS!




Forum Software © ASPPlayground.NET Advanced Edition 2.4.5 ANSI
0.078125