 Web design (CSS, HTML) |
 Mar 1 2012, 09:31 AM
Post
#1
|
|
 Man at arms  Group: Clan Members Posts: 152 Thank(s): 1 Points: 152 Joined: 28-April 10 Member No.: 4,262  |
Hey guys.
I'm attempting to build a website for my badminton club, but for some reason the header and links bar isn't displaying correctly in some versions of IE. I'm completely new at this and I've been writing the code based off tutorials so I don't really know what I'm doing. Can anyone help? The site is currently at http://www.hooduk.plus.com/ It seems to render correctly on the following: FireFox & IE9 on Win 7 Dolphin HD on Android. And has trouble on the following: IE7 & 8 on Win XP IE8 on Win 7 --------------------  |
 |
 
|
 |
Replies
|
Mar 2 2012, 11:26 AM
Post
#2
|
|
 Security and Projects Group: Clan Dogsbody Posts: 4,687 Thank(s): 1098 Points: 2,440 Joined: 31-August 07 From: A Magical Place, with toys in the million, all under one roof Member No.: 1 |
when you say 'not correctly' specifically in what way?
For the time being I wouldn't aim anything at html5, so if you want to define a character set I'd go for: <META http-equiv="Content-Type" content="text/html; charset=utf-8"> The wonderful theme park resort of "<html land.. should probably be "<html lang.."  As mentioned before the 'not correctly' bit is probably just munged up css sticking stuff in the wrong place. I'm currently using XP and FF/Chrome and can't see the contact link as it's gone onto the next line (and since the text is white with no background, can't be seen, unless hoverred over). I suspect there's also something in there that 1 px too large on the vertical, possibly due to padding/borders but am too lazy to check thoroughily I plonked a whole bunch of stuff in your layout.css (most of which might be unneccessary or incorrect, if this works on your browser then cut out changes until you find the bits you're after) and made something that seems a bit better in my browser using this: CODE * {
margin:0; padding:0; } header { width:1024px; height:232px; margin-left:auto; margin-right:auto; background:url(../images/Logo.jpg) top center no-repeat; background-color:#FFF; } nav { width:1024px; margin-left:auto; margin-right:auto; width:1024px; height:33px; background-image:url(../images/nav_bg.png); background-repeat:repeat-x; } #nav_center { } nav ul { list-style:none; } nav a { display:inline; float:left; margin-right:3%; text-decoration:none; color:#FFF; font-family:Tahoma, Geneva, sans-serif; font-weight:bold; padding:.5% 2% .5% 1%; } nav a:hover { background-image:url(../images/nav_fg.png); height:22px; } /* WRAPPER */ #wrapper { width:1024px; height:100%; margin-left:auto; margin-right:auto; border-left:1px solid black; border-right:1px solid black; } #content { width:700px; height:600px; margin-left:auto; margin-right:auto; background-color:#CCC; font-family:Tahoma, Geneva, sans-serif; text-align:center; } #right_side { width:304; height:100%; float:right; } --------------------  |
|
|
|
Posts in this topic
Qrbrrbl Web design (CSS, HTML) Mar 1 2012, 09:31 AM
Magik5 looks like your following an html5 tutorial, which... Mar 1 2012, 11:01 AM Qrbrrbl Cheers monkey, i'll give it a whirl later and ... Mar 2 2012, 02:50 PM Qrbrrbl Ok so i've come back to this after a long whil... Aug 28 2012, 11:05 AM Magik5 Your issue is in my reply above which you've c... Sep 3 2012, 12:44 PM
MonkeyFiend good point about the html5 elements... I'd ste... Sep 4 2012, 09:27 AM |
|
Lo-Fi Version | Time is now: 24th November 2024 - 04:28 PM |