IE formatting - Vidahost Forums

Gareth_H · 22-11-2009

Hello

I wonder if anyone can help, I have created my site located here www.ajhdigital.co.uk.

Unfortunately I seem to have a problem where the content (especially the galleries) is pushed down within the containers in IE but is fine in Chrome.

I have attatched some screenshots below :

This is how the gallery looks in Chrome

But in IE you can see it has been pushed down (even the logo on the left)

somehow it seems to be padding but I cannot see how.

Cheers

Gareth

weaselandalf · 22-11-2009

IE and other browsers all have default padding and margin values assigned to different elements. Try putting:

* {
padding:0;
margin:0;
}

At the top of your CSS stylesheet as this should make padding and margins the same across different browsers.

For more info, have a look at http://meyerweb.com/eric/tools/css/reset/

Gareth_H · 23-11-2009

Hi

That seemed to do the trick, its just thrown all of my other formatting out now.

Cheers

Gareth

Cybernautix SEO · 23-11-2009

looks good on Mac FF.

some realy nice photos in there too.

Gareth_H · 24-11-2009

Thanks

I Think do a bit better with photo, than creating websites.

Gareth

Chrissy Poo · 24-11-2009

Glad you got it sorted. You have some great images there

Gareth_H · 26-11-2009

all sorted in Chrome, Firefox and IE8, however the formatting is way out in IE6 & IE7, anyone any ideas?

Cybernautix SEO · 26-11-2009

if you''ve done everything else then use conditional comments. Bit nasty,but hey - they work! Sometimes there's no option

you need something like this in the <head>

Code:

<!--[if IE 7]>
 <style type="text/css">your IE7 correction styles go in here</style>
<![endif]-->

Gareth_H · 26-11-2009

Quote:

Originally Posted by Cybernautix SEO

if you''ve done everything else then use conditional comments. Bit nasty,but hey - they work! Sometimes there's no option

you need something like this in the <head>

Code:

<!--[if IE 7]>
 <style type="text/css">your IE7 correction styles go in here</style>
<![endif]-->

Cheers, tried that but cant seem to get to work, what should go in the CSS file?

You can see the problem here IE NetRenderer - Browser Compatibility Check -

Cybernautix SEO · 26-11-2009

Hi

nothing goes in the CSS file. It goes in the HTML in the <head> section.

here's one from our site (if you have a look at the source you'll see where it goes)

Code:

<!--[if IE 7]>
 <style type="text/css">.mainmenuitem a {vertical-align: 65%;}</style>
<![endif]-->

we needed this because there's a prob with IE7 not aligning the tabs correctly at the top.

it's specific to IE7. IE8 doesn't do it, and neither does FF. So by hardcoding in a slight fix into the head of the HTML it can be adjusted.

The other thing you can do if you've got a lot of changes for IE7 is to use the conditional code like above, and import a second stylesheet. As long as you have it importing after your main sheet it should take precedence. So for example:

Code:

<!--[if IE 7]>
  <link rel="stylesheet" href="ie7.css" type="text/css" />
<![endif]-->

and that has only your CSS adjustments in there

22-11-2009	#1 (permalink)
Gareth_H Hosting newbie Join Date: Nov 2009 Posts: 6 Thanks: 0 Thanked 0 Times in 0 Posts	IE formatting Hello I wonder if anyone can help, I have created my site located here www.ajhdigital.co.uk. Unfortunately I seem to have a problem where the content (especially the galleries) is pushed down within the containers in IE but is fine in Chrome. I have attatched some screenshots below : This is how the gallery looks in Chrome But in IE you can see it has been pushed down (even the logo on the left) somehow it seems to be padding but I cannot see how. Cheers Gareth

22-11-2009	#2 (permalink)
weaselandalf Senior Member Join Date: May 2009 Posts: 146 Thanks: 7 Thanked 8 Times in 7 Posts	IE and other browsers all have default padding and margin values assigned to different elements. Try putting: * { padding:0; margin:0; } At the top of your CSS stylesheet as this should make padding and margins the same across different browsers. For more info, have a look at http://meyerweb.com/eric/tools/css/reset/ Last edited by weaselandalf; 22-11-2009 at 09:18 PM. Reason: added link

23-11-2009	#4 (permalink)
Cybernautix SEO Senior Member Join Date: Mar 2009 Location: Staffordshire, UK Posts: 227 Thanks: 11 Thanked 26 Times in 23 Posts	looks good on Mac FF. some realy nice photos in there too. __________________ SEO - with proven results CMS systems - take control and grow your website Cybernautix Ltd - Web Design and SEO Staffordshire - 01782 783066 - try us! \| Follow me on Twitter -> http://twitter.com/f1seo

24-11-2009	#6 (permalink)
Chrissy Poo Senior Member Join Date: May 2009 Location: UK Posts: 1,037 Thanks: 36 Thanked 105 Times in 93 Posts	Glad you got it sorted. You have some great images there __________________ I'm just a Blogger and Web Designer in Training Latest Clients: Domestic Cleaning Gloucestershire \| Apple iPhone and iPad Accessories

26-11-2009	#8 (permalink)
Cybernautix SEO Senior Member Join Date: Mar 2009 Location: Staffordshire, UK Posts: 227 Thanks: 11 Thanked 26 Times in 23 Posts	if you''ve done everything else then use conditional comments. Bit nasty,but hey - they work! Sometimes there's no option you need something like this in the <head> Code: <!--[if IE 7]> <style type="text/css">your IE7 correction styles go in here</style> <![endif]--> __________________ SEO - with proven results CMS systems - take control and grow your website Cybernautix Ltd - Web Design and SEO Staffordshire - 01782 783066 - try us! \| Follow me on Twitter -> http://twitter.com/f1seo

23-11-2009	#3 (permalink)
Gareth_H Hosting newbie Join Date: Nov 2009 Posts: 6 Thanks: 0 Thanked 0 Times in 0 Posts	Hi That seemed to do the trick, its just thrown all of my other formatting out now. Cheers Gareth

24-11-2009	#5 (permalink)
Gareth_H Hosting newbie Join Date: Nov 2009 Posts: 6 Thanks: 0 Thanked 0 Times in 0 Posts	Thanks I Think do a bit better with photo, than creating websites. Gareth

26-11-2009	#7 (permalink)
Gareth_H Hosting newbie Join Date: Nov 2009 Posts: 6 Thanks: 0 Thanked 0 Times in 0 Posts	all sorted in Chrome, Firefox and IE8, however the formatting is way out in IE6 & IE7, anyone any ideas?

26-11-2009	#10 (permalink)
Cybernautix SEO Senior Member Join Date: Mar 2009 Location: Staffordshire, UK Posts: 227 Thanks: 11 Thanked 26 Times in 23 Posts	Hi nothing goes in the CSS file. It goes in the HTML in the <head> section. here's one from our site (if you have a look at the source you'll see where it goes) Code: <!--[if IE 7]> <style type="text/css">.mainmenuitem a {vertical-align: 65%;}</style> <![endif]--> we needed this because there's a prob with IE7 not aligning the tabs correctly at the top. it's specific to IE7. IE8 doesn't do it, and neither does FF. So by hardcoding in a slight fix into the head of the HTML it can be adjusted. The other thing you can do if you've got a lot of changes for IE7 is to use the conditional code like above, and import a second stylesheet. As long as you have it importing after your main sheet it should take precedence. So for example: Code: <!--[if IE 7]> <link rel="stylesheet" href="ie7.css" type="text/css" /> <![endif]--> and that has only your CSS adjustments in there __________________ SEO - with proven results CMS systems - take control and grow your website Cybernautix Ltd - Web Design and SEO Staffordshire - 01782 783066 - try us! \| Follow me on Twitter -> http://twitter.com/f1seo

Thread Tools	Search this Thread
Show Printable Version Email this Page	Search this Thread: Advanced Search
Display Modes
Linear Mode Switch to Hybrid Mode Switch to Threaded Mode

Email:		Remember Me
Password: