The Web Design Group

... Making the Web accessible to all.

Welcome Guest ( Log In | Register )

> Problem with site on IE
thenoesis
post May 25 2011, 04:51 AM
Post #1


Newbie
*

Group: Members
Posts: 15
Joined: 14-May 11
Member No.: 14,549



So I am trying to make my website compatible across a multiple of web browsers and I am stuck trying to get my site work in IE. Here is my site http://www.fragmentedmemories.net/

If you have, say, Firefox and IE, on Firefox it looks like this: http://img541.imageshack.us/img541/1410/picture2acs.png

But in IE it looks like this: http://img844.imageshack.us/img844/5476/eduph.png (I fixed the center problem, but my problem is the navigation on top)

How do I fix this? here is my CSS for the navigation. In IE it streches the page where in firefox, chrome, opera it doesn't

css:
CODE
.header {clear: both; top: 0px; margin: 0 auto; position: absolute; text-align: right; padding-top: 17px; letter-spacing: 3px; width: 1000px;}

.body {clear: both; margin: 0 auto; text-align: left; width: 1000px;}

header{
-webkit-box-sizing: border-box; height: 52px; width: 100%; padding: 0px 5px 0px 0px;
-moz-box-sizing: border-box; height: 52px; width: 100%; padding: 0px 5px 0px 0pxx;
box-sizing: border-box; height: 52px; width: 100%; padding: 0px 0px 5px 0px;
}



html:
CODE

<header class="body">
<a href="http://www.fragmentedmemories.net"><img src="http://www.fragmentedmemories.net/images/logo.png"></a>
<div class="header">
<a href="http://www.fragmentedmemories.net/" alt="home">HOME</a>&nbsp; &nbsp; &nbsp; &nbsp;  
<a href="http://www.fragmentedmemories.net/forums/" alt="forums">FORUMS</a>&nbsp; &nbsp; &nbsp;
<a href="http://www.fragmentedmemories.net/?page_id=27" alt="staff">STAFF</a>&nbsp; &nbsp; &nbsp;
<a href="http://www.fragmentedmemories.net/?page_id=2" alt="about">ABOUT</a>&nbsp; &nbsp; &nbsp;
</div>
</header>


Also the slideshow div is off aligned and would like to fix that.

html:
CODE
<aside class="body">
<center>
<div id="fadeshow1"></div>
</center>
</aside>


css:
CODE
aside{
position: relative;
-webkit-box-sizing: border-box; height: 418px; width: 100%;  padding-top: 0px;
-moz-box-sizing: border-box; height: 418px; width: 100%; padding-top: 0px;
box-sizing: border-box; height: 418px; width: 100%; padding-top: 0px;
}

.body {clear: both; margin: 0 auto; text-align: left; width: 1000px;}


This post has been edited by thenoesis: May 25 2011, 05:04 AM
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post

Posts in this topic


Reply to this topicStart new topic
1 User(s) are reading this topic (1 Guests and 0 Anonymous Users)
0 Members:

 



- Lo-Fi Version Time is now: 29th March 2024 - 08:15 AM