CSS Codes
CSS Layouts
Results 1 to 2 of 2

Thread: IE margins.

  1. 02-02-2009, 06:34 PM #1
    davidarechiga
    davidarechiga is offline New Comer (less than 5 posts)
    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% ;
}
    Reply With Quote Reply With Quote
  2. 02-02-2009, 06:37 PM #2
    davidarechiga
    davidarechiga is offline New Comer (less than 5 posts)
    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>
    Reply With Quote Reply With Quote
« Previous Thread | Next Thread »

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
  •  

Forum Rules