Results 1 to 2 of 2

Thread: IE margins.

  1. #1
    Join Date
    Feb 2009
    Posts
    2
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default IE margins.

    the link is

    continuedmovement.com/scf-test/clothing.html

    on the clothing page, it seems Internet Explorer is adding either margins or padding to the clothingMenu div or the divs right next to it when i click on the links to animate the divs back and forth.
    i can specify more description if needed.

    thanks in advance.


    CSS

    Code:
    html, body, div, span,
    h1, h2, h3, h4, h5, h6, p,
    a, em, font, img, small, strike, strong, ul, li,
     {
    	margin: 0;
    	padding: 0;
    	border: 0;
    	outline: 0;
    	font-weight: inherit;
    	font-style: inherit;
    	font-size: 100%;
    	font-family: inherit;
    	vertical-align: baseline;
    }
    
    body {
    	line-height: 1;
    	color: black;
    	background: transparent;
    }
    ol, ul {
    	list-style: none;
    }
    
    
    *{margin:0 auto;}
    
    
    html, body {
    margin:0 auto;
    height:100%;
    background: url(images/background.gif) no-repeat fixed center 90%;
    }
    
    
    div#container {
    margin:0px auto;
    width:800px;
    height:100%;
    }
    
    div#header {
    clear:both;
    margin:0;
    padding:0;
    background-image: url(images/headerBG.jpg);
    width:800px;
    height:260px;
    position:relative;
    }
    div#mainNav {
    	clear:both;
    text-align:right;
    background:#000000 ;
    margin-top:0px;
    width:800px;
    height:30px;
    position:relative;
    
    }
    
    div#mainNav ul, div#mainNav ul li{
    padding:0 15px;
    border:solid white 0px;
    list-style-type:none;
    display:inline;
    line-height:33px;
    font-size:13pt;
    margin:0;
    
    }
    
    
    
    a:link
    {
    color:#999966;
    text-decoration:none;
    }
    
    
    a:visited
    {
    color:#999966;
    text-decoration:none;
    }
    
    a:active
    {
    text-decoration:none;
    }
    a:hover
    {
    color:#000000;
    text-decoration:none;
    }
    
    div#mainContent{
    width:800px;
    height:670px;
    position:relative;
    background:url(images/contentBG.jpg) repeat;
    }
    
    div#mainContent h1{
    margin-left:15px;
    padding-top:15px;
    padding-bottom:15px;
    }
    
    div#mainContent h3{
    border:solid black 0px;
    margin:0px 15px 5px 15px;
    font-size:12.5pt
    }
    
    div#mainContent p{
    border:solid black 0px;
    margin:15px;
    font-size:10.5pt;
    }
    
    div#footer {
    	clear:both;
    padding-left:15px;
    line-height:38px;
    height:8%;
    font-size:9pt;
    margin:0;
    background:black;
    color:#999966;
    position:relative;
    }
    
    div#contdmvmntimg {
    width:132px;
    height:25px;
    position:absolute;
    top:0px;
    right:65px;
    background:url(images/contdmvmnt.jpg) no-repeat;
    line-height:999px;
    overflow:hidden;
    }
    
    div#cushyimg {
    width:132px;
    height:25px;
    position:absolute;
    top:0px;
    right:195px;
    background:url(images/cushy.jpg) no-repeat;
    line-height:999px;
    overflow:hidden;
    }
    
    div#logIn {
    width:auto;
    height:30px;
    line-height:37px;
    background:black;
    position:absolute;
    top:0px;
    right:15px;
    color:white;
    
    
    }
    div#clothingNav {
    	
    width:250px;height:670px;margin:0;	
    }
    
    
    div#shirtDescription {
    	
    width:250px;height:670px;margin:0;	
    }
    
    div#clothingMenu a:link {
    	color:#000;
    	text-decoration:none;
    }
    
    div#clothingMenu a:active {
    	color:#000;
    	text-decoration:none;
    }
    
    div#clothingMenu a:visited {
    	color:#000;
    	text-decoration:none;
    }
    
    div#clothingMenu a:hover {
    	color: #CC9;
    	text-decoration:none;
    }
    
    p a {color:#000;}
    
    div#clothingMenu ul#clothingNav li {
    line-height:27px;	
    text-align:left;
    margin-left:-30px;
    padding:auto 10px;
    border-bottom:0px solid #CC9;
    }
    
    div#clothingMenu ul#clothingNav li:hover {
    	background:url(images/grenade.png) no-repeat 90% 50% ;
    }

  2. #2
    Join Date
    Feb 2009
    Posts
    2
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    Html

    Code:
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <!-- Developer: David Arechiga -->
    <!-- Project: So Cal Felons Website-->
    <head>
    	<title>
    		So Cal Felons | 2009
    	</title>
    		
            <link rel="stylesheet" href="clothing.css" media="screen" />
            
            <meta name="keywords" content="So, Cal, Felons" />
            <meta http-equiv="content-type" content="text/html; char=utf-8" />
    
    <script type="text/javascript" src="IEmarginFix.js"></script>
    <script type="text/javascript" src="jquery-1.2.2.pack.js"></script>
    <script type="text/javascript" src="animatedcollapse.js">
    
    /***********************************************
    * Animated Collapsible DIV v2.0- (c) Dynamic Drive DHTML code library (www.dynamicdrive.com)
    * This notice MUST stay intact for legal use
    * Visit Dynamic Drive at http://www.dynamicdrive.com/ for this script and 100s more
    ***********************************************/
    
    </script>
    
    
    <script type="text/javascript">
    
    
    animatedcollapse.addDiv('1', 'fade=1,speed=400,group=pets,hide=0')
    animatedcollapse.addDiv('2', 'fade=1,speed=400,group=pets,persist=1,hide=1')
    animatedcollapse.addDiv('3', 'fade=1,speed=400,group=pets,hide=1')
    animatedcollapse.addDiv('4', 'fade=1,speed=400,group=pets,hide=1')
    animatedcollapse.addDiv('5', 'fade=1,speed=400,group=pets,hide=1')
    animatedcollapse.addDiv('6', 'fade=1,speed=400,group=pets,hide=1')
    
    animatedcollapse.init()
    
    </script>
    
    
    
    	</head>
    	
    	<body>
    	<div id="container">
    		<div id="header">
    		
    		
    		</div><!--end header-->
      <div id="mainNav">
    			<ul id="nav">
    					<li><a href="news.html">News</a></li>
                    	<li><a href="clothing.html">Clothing</a></li>
                        <li><a href="events.html">Events</a></li>
                        <li><a href="artists.html">Artists</a></li>
                        <li><a href="friends.html">Friends</a></li>
                        <li><a href="contact.html">Contact</a></li>
    			</ul>
    	  </div><!--end mainNav-->
    		
    	  <div id="mainContent">
          
    			
    	 <div id="clothingMenu" style="padding-left:0;float:left; padding:0px 0px 0 0;
         	width:200px;height:670px; background:transparent;text-align:left;">
    <ul id="clothingNav" style="list-style-type:none;width:150px;margin-top:15px;line-height:20px;">
    <li><strong>T-Shirts</strong></li>
    <li><a href="javascript:animatedcollapse.toggle('1')">Cali Knuckles</a></li>
    <li><a href="javascript:animatedcollapse.toggle('2')">Pray For Us (Black)</a></li>
    <li><a href="javascript:animatedcollapse.toggle('3')">Grenades</a></li>
    <li><a href="javascript:animatedcollapse.toggle('4')">Pray For Us (White)</a></li>
    <li><a href="javascript:animatedcollapse.toggle('5')">Zebra</a></li>
    <li><strong>Miscellaneous</strong></li>
    <li><a href="javascript:animatedcollapse.toggle('6')">Booty Shorts</a></li>
    </ul>
    
    </div>
    
    
    <div id="1" style="margin-left:150px;">
    <!-- left div -->
    <div style="float:left;width:300px;height:670px;padding-bottom:0px; background:transparent;text-align:left;">
    <h1 style="padding-left:15px;">Kali Knuckles</h1>
    <p style="padding-left:15px;font-size:12px;">6 oz 100% cotton tee with front right chest print and side print<br /><br />
    <a href="http://socalfelons.bigcartel.com/product/kali-knucks" target="_blank" style="color:#000;">Buy Now</a></p>
    </div>
    <!-- right div -->
    <div style="float:left;width:270px;height:655px;padding-bottom:15px;padding:15px 15px 0 0; background: transparent;text-align:right;">
    <img src="images/caliknucksfront.jpeg" width="205" height="306" alt="caliknucks" /><br /><br />
    <img src="images/caliknucksangle.jpeg" width="205" height="306" alt="caliknucksangle" /> 
    </div>
    </div>
    
    <div id="2" style="margin-left:150px;">
    <!-- left div -->
    <div style="float:left;width:300px;height:670px;padding-bottom:0px; background:transparent;text-align:left;">
    <h1 style="padding-left:15px;">Pray For Us (Black)</h1>
    <p style="padding-left:15px;font-size:12px;">6 oz 100% cotton tee with front right chest print and side print<br /><br />
    <a href="#" target="_blank" style="color:#000;">Buy Now</a>
    </p>
    </div>
    <!-- right div -->
    <div style="float:left;width:270px;height:655px;padding-bottom:15px;padding:15px 15px 0 0; background: transparent;text-align:right;">
    <img src="images/holyhandsblackfront.jpeg" width="205" height="306" alt="holyhandsblackfront" /><br /><br />
    <img src="images/holyhandsblackangle.jpeg" width="205" height="306" alt="holyhandsblackangle" /> 
    </div>
    </div>
    
    <div id="3" style="margin-left:150px;">
    <!-- left div -->
    <div style="float:left;width:300px;height:670px;padding-bottom:0px; background:transparent;text-align:left;">
    <h1 style="padding-left:15px;">Grenades</h1>
    <p style="padding-left:15px;font-size:12px;">6 oz 100% cotton tee grenade logo across neck<br /><br />
    <a href="http://socalfelons.bigcartel.com/product/grenades" target="_blank" style="color:#000;">Buy Now</a></p>
    </div>
    <!-- right div -->
    <div style="float:left;width:270px;height:655px;padding-bottom:15px;padding:15px 15px 0 0; background: transparent;text-align:right;">
    <img src="images/grenades.jpeg" width="205" height="306" alt="grenades" />
    </div>
    </div>
    
    <div id="4" style="margin-left:150px;">
    <!-- left div -->
    <div style="float:left;width:300px;height:670px;padding-bottom:0px; background:transparent;text-align:left;">
    <h1 style="padding-left:15px;">Pray For Us (White)</h1>
    <p style="padding-left:15px;font-size:12px;">100% cotton tee white with black print right chest.<br /><br />
    <a href="http://socalfelons.bigcartel.com/product/pray-for-us-felony-tee-guys" target="_blank" style="color:#000;">Buy Now</a>
    </p>
    </div>
    <!-- right div -->
    <div style="float:left;width:270px;height:655px;padding-bottom:15px;padding:15px 15px 0 0; background: transparent;text-align:right;">
    <img src="images/holyhandswhitefront.jpeg" width="205" height="306" alt="holyhandswhitefront" /><br /><br />
    <img src="images/holyhandswhiteangle.jpeg" width="205" height="306" alt="holyhandswhiteangle" /> 
    </div>
    </div>
    
    <div id="5" style="margin-left:150px;">
    <!-- left div -->
    <div style="float:left;width:300px;height:670px;padding-bottom:0px; background:transparent;text-align:left;">
    <h1 style="padding-left:15px;">Zebra Tee</h1>
    <p style="padding-left:15px;font-size:12px;"><br /><br />
    <a href="http://socalfelons.bigcartel.com/product/zebra-tee" target="_blank" style="color:#000;">Buy Now</a></p>
    </div>
    <!-- right div -->
    <div style="float:left;width:270px;height:655px;padding-bottom:15px;padding:15px 15px 0 0; background: transparent;text-align:right;">
    <img src="images/zebra.jpeg" width="205" height="306" alt="zebra" />
    </div>
    </div>
    
    <div id="6" style="margin-left:150px;">
    <!-- left div -->
    <div style="float:left;width:300px;height:670px;padding-bottom:0px; background:transparent;text-align:left;">
    <h1 style="padding-left:15px;">So Cal Felons Booty Shorts</h1>
    <p style="padding-left:15px;font-size:12px;"><br /><br />
    <a href="#" target="_blank" style="color:#000;">Buy Now</a></p>
    </div>
    <!-- right div -->
    <div style="float:left;width:270px;height:655px;padding-bottom:15px;padding:15px 15px 0 0; background: transparent;text-align:right;"><img src="images/bootyshorts.jpeg" width="265" height="160" alt="bootyshorts" align="right" />
    </div>
     </div>
    
    
    
    
    
             
    	  </div><!--end mainContent-->
    	
    		<div id="footer">
    		<p>All Content Copyright&copy; So Cal Felons 2009</p>
    		<div id="cushyimg"><a href="#">Cushy CMS</a></div><!--end cushyimg-->
    		<div id="contdmvmntimg"></div><!--end contdmvmntimg-->
    		<div id="logIn"><a href="#">Login?</a></div><!--end logIn-->
    		
    	  </div><!--end footer-->
    	</div><!--end container-->
    	
    	</body>
    	
    </html>

Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •