CSS Help
 
Forums: » Register « |  User CP |  Games |  Calendar |  Members |  FAQs |  Sitemap |  Support | 
User Name:
Password:
Remember me
Go Back   Dev Shed Forums > Web Design > CSS Help
Reload this Page

WHY WHY don’t they make them work the same????????

Discuss WHY WHY don’t they make them work the same???????? in the CSS Help forum on Dev Shed.
WHY WHY don’t they make them work the same???????? Cascading Style Sheets (CSS) forum discussing all levels of CSS, including CSS1, CSS2 and CSS Positioning. CSS provides a robust way of applying standardized design concepts to your web pages.

Reply
Add This Thread To:
  Del.icio.us   Digg   Google   Spurl   Blink   Furl   Simpy   Y! MyWeb 
« Previous Thread | Next Thread »  
Thread Tools Search this Thread Rate Thread Display Modes
 
Unread Dev Shed Forums Sponsor:
  #1  
Old May 9th, 2008, 08:29 AM
si666 si666 is offline
Registered User
Dev Shed Newbie (0 - 499 posts)
  
Join Date: May 2007
Posts: 9 si666 User rank is Just a Lowly Private (1 - 20 Reputation Level) 
Time spent in forums: 2 h 6 m 34 sec
Reputation Power: 0
WHY WHY don’t they make them work the same????????
Hi,

I’m not what you call a regular css user but am trying to be good and get away from table layouts. I’m having problems with my css layout in i.e7 and ff2.

In FF there is a gap between the bottom of the frontTest.jpg image and the footer (looks around 10px) which is bad, but it fit snugly against right hand side of the "container" which is good.

In I.E7 there is no gap between the bottom of the image which is good, but a gap of around 3px from the right hand side of the image to the side of the container which is bad. WHY WHY don’t they make them work the same????????

Anyway any ideas. I’ve had a look round the forum for a few hours but can’t come up with anything.

Oh I’ve validated the css and its ok

Thanks

This is the HTML page

Code:
<html xmlns="http://www.w3.org/1999/xhtml">
<head xmlns="">
<title>Online Fashion for the masses @ NothingNewToWear</title>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
        <meta http-equiv="content-type" content="text/html; charset=utf-8" />
        <meta content="HAPedit 3.1" name="generator" />
        <link href="/ekmps/shops/rajan/images/favicon.ico" rel="shortcut icon" />
<link href="/ekmps/shops/rajan/images/main.css" type="text/css" rel="stylesheet" />
        <link href="new.css" rel="stylesheet" type="text/css">
</head>
    <body xmlns="">
        <div id="container">
        	<div id="header">
				<img src="../images/design/WebTitle.jpg" width="850" height="57">
			</div>
        
        	<div id="content">
				<table width="100%" border="0" bgcolor="#990000">
    				<tbody>
        				<tr  valign="middle" style="font-size: 10px;">
							<td width="60%"><A HREF="index.asp">Home</A> > 			</td>
							<td align="right" valign="middle"><!-- Search Form -->
								<form action="index.asp?function=SEARCH" method="post">
									search:                   <input class="navinput" name="search" size="18" />                   <input type				="submit" value="go" class="navbutton" name="submit" />
								</form>
							</td>
        				</tr>
    				</tbody>
				</table>
				<table id="Table_01" width="100%" border="0" cellpadding="0" cellspacing="0">
					<tr>
						<td><img src="../images/design/frontTest.jpg" width="698px" height="464px"></td>
					</tr>
	
				</table>

			</div>
        
        <!--Main Navigation-->
        <div id="navigation">
        <h2>Menswear</h2>
        	
        		<ul>
            			<li><a href="polos--t-shirts-17-c.asp">T’s & Polos </a></li>
            			<li><a href="shirts-20-c.asp">Shirts</a> </li>
						<li><a href="sweats--tops-16-c.asp">Sweats and Tops </a></li>
						<li><a href="knitwear-15-c.asp">Knitwear</a> </li>
						<li><a href="jackets-13-c.asp">Jackets</a> </li>
						<li><a href="coats-21-c.asp">Coats</a> </li>
						<li><a href="jeans--combats-14-c.asp">Jeans & Combats </a></li>
						<li><a href="shorts-18-c.asp">Shorts</a> </li>
        	</ul>
			
        <h2>Womenswear</h2>
				<ul>
					<li><a href="tops-22-c.asp">Tops</a> </li>
					<li><a href="dresses--tunics-23-c.asp">Dresses & Tunics </a></li>
					<li><a href="sweats--jog-suits-24-c.asp">Sweats & Jog Suits </a></li>
					<li><a href="knitwear-25-c.asp">Knitwear</a> </li>
					<li><a href="jackets-26-c.asp">Jackets & Coats</a> </li>
					<li><a href="jeans--combats-28-c.asp">Jeans & Shorts </a></li>
				</ul>
        	
        </div>
		
        <div id="extra">
        	<h2>Items in Focus</h2>
        		<div id="navcontainerBargains">
        			<ul>
            			<li><a href="http://www.nothingnewtowear.com/Mens-top-sellers-34-c.asp">Mens Top Sellers</a> </li>
						<li><a href="http://www.nothingnewtowear.com/mens-hooded-tops-30-c.asp">Mens hooded tops</a> </li>
						<li><a href="http://www.nothingnewtowear.com/hooded-tops-29-c.asp">Ladies hooded tops</a> </li>
						<li><a href="http://www.nothingnewtowear.com/ljn-145nikkitaind8-632-p.asp">Skinny Leg Jean</a> </li>
        			</ul>
        		</div>
        </div>
        
			<div id="footer">
			  	<ul id="navlist">
					<li><a href="index.asp">Home</a> </li>
					<li><a href="http://www.nothingnewtowear.com/index.asp?function=WEBPAGE&page=2">Terms & Conditions</a> </li>
					<li><a href="http://www.nothingnewtowear.com/index.asp?function=WEBPAGE&page=2#PRIVACY">Privacy Policy</a> </li>
					<li><a href="http://www.nothingnewtowear.com/index.asp?function=WEBPAGE&page=4">Returns  Policy</a> </li>
					<li><a href="http://www.nothingnewtowear.com/index.asp?function=WEBPAGE&page=3">Contact Us</a> </li>
				</ul>
			</div>
    </div>
		
        <script type="text/javascript">
var gaJsHost = (("https:" == document.location.protocol) ? "https://ssl." : "http://www.");
document.write(unescape("%3Cscript src='" + gaJsHost + "google-analytics.com/ga.js' type='text/javascript'%3E%3C/script%3E"));
</script>
<script type="text/javascript">
var pageTracker = _gat._getTracker("UA-2765951-1");
pageTracker._initData();
pageTracker._trackPageview();
</script>
    </body>
</html>
			<!-- Start of ekmHits code --> 
				<script language="JavaScript" src="http://global.ekmpinpoint.com/hits/info.js"></script>
				<script language="JavaScript">
				<!--
				GetStats('rajan','6','0');
				// -->
				</script> 
			<!-- End of ekmHits code -->


This is the CSS


Code:
html,body{margin:0;padding:0}
p {margin:0 0 1em 0;padding:0}
form {margin:0;padding:0} 

html,body{
padding-left:0px;
padding-right:0px;
padding-top:0px;
padding-bottom:0px;

margin-top:0px;
margin-right:0px;
margin-left:0px;
margin-bottom:0px;

background-color:#FFFFFF;}

body{font:.75em arial,sans-serif;text-align:center}

h1{color:#333366; font-family:Arial, Helvetica, sans-serif; font-size:20px; text-align:left;
padding-left:10px;
padding-right:0px;
padding-top:0px;
padding-bottom:0px;

margin-top:0px;
margin-right:0px;
margin-left:0px;
margin-bottom:0px;}

h2{color:#ff0000; font-family:Arial, Helvetica, sans-serif; font-size:18px; text-align:left;
padding-left:10px;
padding-right:0px;
padding-top:0px;
padding-bottom:0px;

margin-top:0px;
margin-right:0px;
margin-left:0px;
margin-bottom:0px;}

h3{color:#999999; font-family:Arial, Helvetica, sans-serif; font-size:18px; text-align:left;
padding-left:10px;
padding-right:0px;
padding-top:0px;
padding-bottom:0px;

margin-top:0px;
margin-right:0px;
margin-left:0px;
margin-bottom:0px;
}

h4{color:#333366; font-family:Arial, Helvetica, sans-serif; font-size:14px; text-align:left;
padding-left:10px;
padding-right:0px;
padding-top:0px;
padding-bottom:0px;

margin-top:0px;
margin-right:0px;
margin-left:0px;
margin-bottom:0px;}

p{font-family:Arial, Helvetica, sans-serif; font-size:.75em; color:#333366; text-align:left;
padding-left:10px;
padding-right:0px;
padding-top:10px;
padding-bottom:0px;

margin-top:0px;
margin-right:0px;
margin-left:0px;
margin-bottom:0px;}



hr {color:#cccccc; height:1px;}



div#container{text-align:left;
padding-left:0px;
padding-right:0px;
padding-top:0px;
padding-bottom:0px;

margin-top:0px;
margin-right:0px;
margin-left:0px;
margin-bottom:0px;
}

div#container{width:850px; margin:0px auto;
padding-left:0px;
padding-right:0px;
padding-top:0px;
padding-bottom:0px;
background-color:#FFFFFF;
border: none;
	
} 

 

/*---------------------------------------------------------Header---------------------------------------------------------*/

/*--div#header h2{height:80px;line-height:80px;
padding-left:10px;
padding-right:0px;
padding-top:0px;
padding-bottom:0px;

margin-top:0px;
margin-right:0px;
margin-left:0px;
margin-bottom:0px;
  
background: #EEE;color: #000000;}

div#header h2{height:162px;line-height:80px;
padding-left:10px;
padding-right:0px;
padding-top:0px;
padding-bottom:0px;

margin-top:0px;
margin-right:0px;
margin-left:0px;
margin-bottom:0px;
background: #EEE;color: #000000;  background-image:url(http://www.ekmpowershop6.com/ekmps/shops/rajan/images/header-static.jpg)}--*/

/*---------------------------------------------------End of Header---------------------------------------------------------*/



/*-------------------------------------------------------Top Nav---------------------------------------------------------

div#topNav{ float:right; width:630px; border:#000000 0px;
padding-left:0px;
padding-right:0px;
padding-top:0px;
padding-bottom:0px;

margin-top:0px;
margin-right:0px;
margin-left:0px;
margin-bottom:0px;}







-------------------------------------------------Content---------------------------------------------------------------*/

div#content{float:right; width:698px; height:auto;
padding-left:0px;
padding-right:0px;
padding-top:0px;
padding-bottom:0px;

margin-top:0px;
margin-right:0px;
margin-left:0px;
margin-bottom:0px;

text-align:center;

}

div#content p{line-height:1.4;
}

div#content img{ border:none; 
padding-left:0px;
padding-right:0px;
padding-top:0px;
padding-bottom:0px;

margin-top:0px;
margin-right:0px;
margin-left:0px;
margin-bottom:0px;
}





/*-------------------------------------------------End of Content---------------------------------------------------------*/











/*------------------------------------------------Main Navigation---------------------------------------------------------*/

div#navigation{float:left; width:150px; background:#ffffff; border:#ff0000 solid 1px ;
padding-left:0px;
padding-right:0px;
padding-top:0px;
padding-bottom:0px;

margin-top:0px;
margin-right:0px;
margin-left:0px;
margin-bottom:0px;
 } 
 



#navigation ul
{
list-style-type: none;
text-align: left;
text-indent:0px;

padding-left:15px;
padding-right:0px;
padding-top:0px;
padding-bottom:0px;

margin-top:10px;
margin-right:0px;
margin-left:0px;
margin-bottom:0px;

}

#navigation ul li a {
background: transparent url(http://www.ekmpowershop6.com/ekmps/shops/rajan/images/grey.gif) left center no-repeat;

text-align: left;
font: normal 1em "Lucida Grande", "Lucida Sans Unicode", verdana, lucida, sans-serif;
text-decoration: none;
color: #000000;

padding-left:15px;
padding-right:0px;
padding-top:0px;
padding-bottom:0px;

margin-top:0px;
margin-right:0px;
margin-left:0px;
margin-bottom:0px;
}

#navigation li { 
padding-left:0px;
padding-right:0px;
padding-top:0px;
padding-bottom:5px;

margin-top:0px;
margin-right:0px;
margin-left:0px;
margin-bottom:0px;}



#navigation ul li a:hover
{
background: transparent url(http://www.ekmpowershop6.com/ekmps/shops/rajan/images/red.gif) left center no-repeat;
color: #ff0000;
}

#nnavigation li { 
padding-left:0px;
padding-right:0px;
padding-top:0px;
padding-bottom:5px;

margin-top:2px;
margin-right:0px;
margin-left:0px;
margin-bottom:0px;}

#navigation ul li a#current
{
background: transparent url(http://www.ekmpowershop6.com/ekmps/shops/rajan/images/.gif) left center no-repeat;
color: #666;
}

/*--------------------------------------------End of Main Navigation---------------------------------------------------------*/
















/*-----------------------------------------------Bargain Navigation---------------------------------------------------------*/

div#extra{float:left; clear:left; width:150px; text-align:left; background:#000000; border:#ff0000 solid 1px; border-top:none;
padding-left:0px;
padding-right:0px;
padding-top:5px;
padding-bottom:15px;

margin-top:0px;
margin-right:0px;
margin-left:0px;
margin-bottom:0px;} 


#navcontainerBargains ul
{
list-style-type: none;

padding-left:15px;
padding-right:0px;
padding-top:5px;
padding-bottom:0px;

margin-top:0px;
margin-right:0px;
margin-left:0px;
margin-bottom:0px;


}

#navcontainerBargains ul li a
{
background: transparent url(http://www.ekmpowershop6.com/ekmps/shops/rajan/images/grey.gif) left center no-repeat;
text-align: left;
font: normal 1em "Lucida Grande", "Lucida Sans Unicode", verdana, lucida, sans-serif;
text-decoration: none;
color: #ffffff;

padding-left:15px;
padding-right:0px;
padding-top:0px;
padding-bottom:0px;

margin-top:0px;
margin-right:0px;
margin-left:0px;
margin-bottom:0px;
}

#navcontainerBargains li {text-align:left;
padding-left:0px;
padding-right:0px;
padding-top:5px;
padding-bottom:0px;

margin-top:0px;
margin-right:0px;
margin-left:0px;
margin-bottom:0px;}

#navcontainerBargains ul li a:hover
{
background: transparent url(http://www.ekmpowershop6.com/ekmps/shops/rajan/images/red.gif) left center no-repeat;
color: #ff0000; text-align:left;
padding-left:15px;
padding-right:0px;
padding-top:0px;
padding-bottom:0px;

margin-top:0px;
margin-right:0px;
margin-left:0px;
margin-bottom:0px;
}





/*----------------------------------------End of Bargain Navigation---------------------------------------------------------*/



/*-----------------------------------------------Secure---------------------------------------------------------

div#secure{float:left;clear:left;width:150px; text-align: center} 

div#secure{background:#ffffff; border:#ff0000 solid 1px; text-align:left;
}



--------------------------------------End of Secure---------------------------------------------------------*/








/*-----------------------------------------------------Footer---------------------------------------------------------------*/

div#footer{clear:both; width:100%;  float:left;
padding-left:0px;
padding-right:0px;
padding-top:0px;
padding-bottom:0px;

margin-top:0px;
margin-right:0px;
margin-left:0px;
margin-bottom:0px;} 

div#footer{background: #000000;color: #FFF; text-align:center; vertical-align:middle;


}



#navlist li
{
display: inline;
list-style-type: none;
color: #666666;

padding-left:0px;
padding-right:0px;
padding-top:10px;
padding-bottom:0px;

margin-top:0px;
margin-right:0px;
margin-left:0px;
margin-bottom:0px;
}
 
#navlist a { color:#666666; text-decoration:none;
vertical-align:middle;
padding-left:10px;
padding-right:40px;
padding-top:0px;
padding-bottom:0px;

margin-top:0px;
margin-right:0px;
margin-left:0px;
margin-bottom:0px;
vertical-align:text-top;


}


/*----------------------------------------------End of Footer--------------------------------------------------------------*/



/*----------------------------------------------sizetable--------------------------------------------------------------

#sizetable { border: solid #cccccc 1px;
			font-size: 12px;
			text-align:left;

}

#sizetable th {
	text-align: center;
	background-color:#99ffff;
	color:#000000;
	
}

#sizetable td {border-bottom: solid #cccccc 1px;
				padding-left:10px;
				
}

.sizeon { text-indent: 0px; background-color: #66CCCC; font-weight:bold; color:#FFFFFF;

}

.cartSize { border-top:#cccccc solid 1px; padding-top:5px; text-align:center;
}



---------------------------------------------/sizetable--------------------------------------------------------------*/

/*----------------------------------------------sizetable-------------------------------------------------------------

#sizeGuide { border: solid #cccccc 1px;
			font-size: 10px;
			text-align: center;

}

#sizeGuide th {
	text-align: center;
	background-color:#99ffff;
	color:#000000;
	
}

#sizeGuide td {border-bottom: solid #cccccc 1px;
				
				
}

.sizeGuideon { text-indent: 0px; background-color: #66CCCC; font-weight:bold; color:#FFFFFF;

}

.cartSize { border-top:#cccccc solid 1px; padding-top:5px; text-align:center;
}



---------------------------------------------/sizetable--------------------------------------------------------------*/

.flash { border-left:solid #CCCCCC 1px}

/*----------------------------------------------alsobought-------------------------------------------------------------

#alsobought { text-align:center; border: none;


}

#alsobought th{ text-align:left; border-bottom: solid 1px #CCCCCC;

}

#alsobought td{ text-align: center; border-bottom: solid 1px #CCCCCC; font-size:9px;

}

---------------------------------------------alsobought--------------------------------------------------------------*/


.minicart { border:solid #cccccc 1px; margin-right:5px;

}

A:link    { color: #333366; }
A:active  { color: #333366; }
A:visited { color: #333366; }
Reply With Quote
  #2  
Old May 9th, 2008, 08:47 AM
essee essee is offline
Contributing User
Dev Shed Newbie (0 - 499 posts)
  
Join Date: Mar 2008
Posts: 82 essee User rank is Sergeant (500 - 2000 Reputation Level)essee User rank is Sergeant (500 - 2000 Reputation Level)essee User rank is Sergeant (500 - 2000 Reputation Level)essee User rank is Sergeant (500 - 2000 Reputation Level)essee User rank is Sergeant (500 - 2000 Reputation Level) 
Time spent in forums: 2 Days 7 h 27 m 10 sec
Reputation Power: 12
Are you aware that different browsers allocate different default attributes to various elements. Margin and padding being the main cause for problems.

I didn't go through all your code but if this is the problem have a read of this article
http://www.search-this.com/2007/03/...rgin-for-error/
Reply With Quote
  #3  
Old May 9th, 2008, 09:29 AM
si666 si666 is offline
Registered User
Dev Shed Newbie (0 - 499 posts)
  
Join Date: May 2007
Posts: 9 si666 User rank is Just a Lowly Private (1 - 20 Reputation Level) 
Time spent in forums: 2 h 6 m 34 sec
Reputation Power: 0
Give a man a fish
“Give a man a fish; you have fed him for today. Teach a man to fish; and you have fed him for a lifetime”—

Thanks for the article. I’m working my through it.
Cheers

Oh by the way I wasnt aware of the different default settings.
Reply With Quote
  #4  
Old May 12th, 2008, 02:26 PM
si666 si666 is offline
Registered User
Dev Shed Newbie (0 - 499 posts)
  
Join Date: May 2007
Posts: 9 si666 User rank is Just a Lowly Private (1 - 20 Reputation Level) 
Time spent in forums: 2 h 6 m 34 sec
Reputation Power: 0
Still not there
Ok I’ve worked on this another day and I’m just left with a small vertical gap of around 1px between my two navigation elements and my div id#content. No matter which attributes I change I just cant get rid of it.

Any ideas anyone. Would be gratefully appreciated.

Code validates


My html is now.

Code:
<html xmlns="http://www.w3.org/1999/xhtml">
<head xmlns="">
<title>Online Fashion for the masses @ NothingNewToWear</title>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
        <meta http-equiv="content-type" content="text/html; charset=utf-8" />
        <meta content="HAPedit 3.1" name="generator" />
        <link href="/ekmps/shops/rajan/images/favicon.ico" rel="shortcut icon" />
<link href="/ekmps/shops/rajan/images/main.css" type="text/css" rel="stylesheet" />
        <link href="new.css" rel="stylesheet" type="text/css">
</head>
    <body xmlns="">
        <div id="container">
        	<div id="header">
				<img src="../images/design/WebTitle.jpg" width="850" height="57">
			</div>
        
        	<div id="content">
				<table width="100%" border="0" bgcolor="#990000">
    				<tbody>
        				<tr  valign="middle" style="font-size: 10px;">
							<td width="60%"><A HREF="index.asp">Home</A> > 			</td>
							<td align="right" valign="middle"><!-- Search Form -->
								<form action="index.asp?function=SEARCH" method="post">
									search:                   <input class="navinput" name="search" size="18" />                   <input type				="submit" value="go" class="navbutton" name="submit" />
								</form>
							</td>
        				</tr>
    				</tbody>
				</table>
				<table id="Table_01" width="100%" border="0" cellpadding="0" cellspacing="0">
					<tr>
						<td><img src="../images/design/frontTest.jpg" width="698px" height="464px"></td>
					</tr>
	
				</table>

			</div>
        
        <!--Main Navigation-->
        <div id="navigation">
        <h2>Menswear</h2>
        	
        		<ul>
            			<li><a href="polos--t-shirts-17-c.asp">T’s & Polos </a></li>
            			<li><a href="shirts-20-c.asp">Shirts</a> </li>
						<li><a href="sweats--tops-16-c.asp">Sweats and Tops </a></li>
						<li><a href="knitwear-15-c.asp">Knitwear</a> </li>
						<li><a href="jackets-13-c.asp">Jackets</a> </li>
						<li><a href="coats-21-c.asp">Coats</a> </li>
						<li><a href="jeans--combats-14-c.asp">Jeans & Combats </a></li>
						<li><a href="shorts-18-c.asp">Shorts</a> </li>
        	</ul>
			
        <h2>Womenswear</h2>
				<ul>
					<li><a href="tops-22-c.asp">Tops</a> </li>
					<li><a href="dresses--tunics-23-c.asp">Dresses & Tunics </a></li>
					<li><a href="sweats--jog-suits-24-c.asp">Sweats & Jog Suits </a></li>
					<li><a href="knitwear-25-c.asp">Knitwear</a> </li>
					<li><a href="jackets-26-c.asp">Jackets & Coats</a> </li>
					<li><a href="jeans--combats-28-c.asp">Jeans & Shorts </a></li>
				</ul>
        	
        </div>
		
        <div id="extra">
        	<h2>Items in Focus</h2>
        		<div id="navcontainerBargains">
        			<ul>
            			<li><a href="http://www.nothingnewtowear.com/Mens-top-sellers-34-c.asp">Mens Top Sellers</a> </li>
						<li><a href="http://www.nothingnewtowear.com/mens-hooded-tops-30-c.asp">Mens hooded tops</a> </li>
						<li><a href="http://www.nothingnewtowear.com/hooded-tops-29-c.asp">Ladies hooded tops</a> </li>
						<li><a href="http://www.nothingnewtowear.com/ljn-145nikkitaind8-632-p.asp">Skinny Leg Jean</a> </li>
        			</ul>
        		</div>
        </div>
        
			<div id="footer">
			  	<ul id="navlist">
					<li><a href="index.asp">Home</a> </li>
					<li><a href="http://www.nothingnewtowear.com/index.asp?function=WEBPAGE&page=2">Terms & Conditions</a> </li>
					<li><a href="http://www.nothingnewtowear.com/index.asp?function=WEBPAGE&page=2#PRIVACY">Privacy Policy</a> </li>
					<li><a href="http://www.nothingnewtowear.com/index.asp?function=WEBPAGE&page=4">Returns  Policy</a> </li>
					<li><a href="http://www.nothingnewtowear.com/index.asp?function=WEBPAGE&page=3">Contact Us</a> </li>
				</ul>
			</div>
    </div>
		
        <script type="text/javascript">
var gaJsHost = (("https:" == document.location.protocol) ? "https://ssl." : "http://www.");
document.write(unescape("%3Cscript src='" + gaJsHost + "google-analytics.com/ga.js' type='text/javascript'%3E%3C/script%3E"));
</script>
<script type="text/javascript">
var pageTracker = _gat._getTracker("UA-2765951-1");
pageTracker._initData();
pageTracker._trackPageview();
</script>
    </body>
</html>
			<!-- Start of ekmHits code --> 
				<script language="JavaScript" src="http://global.ekmpinpoint.com/hits/info.js"></script>
				<script language="JavaScript">
				<!--
				GetStats('rajan','6','0');
				// -->
				</script> 
			<!-- End of ekmHits code -->


and css


Code:
html,body{margin:0;padding:0}
p {margin:0 0 1em 0;padding:0}
form {margin:0;padding:0} 

html,body{
padding-left:0px;
padding-right:0px;
padding-top:0px;
padding-bottom:0px;

margin-top:0px;
margin-right:0px;
margin-left:0px;
margin-bottom:0px;

background-color:#FFFFFF;}

body{font:.75em arial,sans-serif;text-align:center}

h1{color:#333366; font-family:Arial, Helvetica, sans-serif; font-size:20px; text-align:left;
padding-left:10px;
padding-right:0px;
padding-top:0px;
padding-bottom:0px;

margin-top:0px;
margin-right:0px;
margin-left:0px;
margin-bottom:0px;}

h2{color:#ff0000; font-family:Arial, Helvetica, sans-serif; font-size:18px; text-align:left;
padding-left:10px;
padding-right:0px;
padding-top:0px;
padding-bottom:0px;

margin-top:0px;
margin-right:0px;
margin-left:0px;
margin-bottom:0px;}

h3{color:#999999; font-family:Arial, Helvetica, sans-serif; font-size:18px; text-align:left;
padding-left:10px;
padding-right:0px;
padding-top:0px;
padding-bottom:0px;

margin-top:0px;
margin-right:0px;
margin-left:0px;
margin-bottom:0px;
}

h4{color:#333366; font-family:Arial, Helvetica, sans-serif; font-size:14px; text-align:left;
padding-left:10px;
padding-right:0px;
padding-top:0px;
padding-bottom:0px;

margin-top:0px;
margin-right:0px;
margin-left:0px;
margin-bottom:0px;}

p{font-family:Arial, Helvetica, sans-serif; font-size:.75em; color:#333366; text-align:left;
padding-left:10px;
padding-right:0px;
padding-top:10px;
padding-bottom:0px;

margin-top:0px;
margin-right:0px;
margin-left:0px;
margin-bottom:0px;}



hr {color:#cccccc; height:1px;}



div#container{text-align:left;
padding-left:0px;
padding-right:0px;
padding-top:0px;
padding-bottom:0px;

margin-top:0px;
margin-right:0px;
margin-left:0px;
margin-bottom:0px;
}

div#container{width:850px; margin:0px auto;
padding-left:0px;
padding-right:0px;
padding-top:0px;
padding-bottom:0px;
background-color:#FFFFFF;
border: none;
	
} 

 

/*---------------------------------------------------------Header---------------------------------------------------------*/

/*--div#header h2{height:80px;line-height:80px;
padding-left:10px;
padding-right:0px;
padding-top:0px;
padding-bottom:0px;

margin-top:0px;
margin-right:0px;
margin-left:0px;
margin-bottom:0px;
  
background: #EEE;color: #000000;}

div#header h2{height:162px;line-height:80px;
padding-left:10px;
padding-right:0px;
padding-top:0px;
padding-bottom:0px;

margin-top:0px;
margin-right:0px;
margin-left:0px;
margin-bottom:0px;
background: #EEE;color: #000000;  background-image:url(http://www.ekmpowershop6.com/ekmps/shops/rajan/images/header-static.jpg)}--*/

/*---------------------------------------------------End of Header---------------------------------------------------------*/



/*-------------------------------------------------------Top Nav---------------------------------------------------------

div#topNav{ float:right; width:630px; border:#000000 0px;
padding-left:0px;
padding-right:0px;
padding-top:0px;
padding-bottom:0px;

margin-top:0px;
margin-right:0px;
margin-left:0px;
margin-bottom:0px;}







-------------------------------------------------Content---------------------------------------------------------------*/

div#content{float:right; width:698px; height:auto;
padding-left:0px;
padding-right:0px;
padding-top:0px;
padding-bottom:0px;

margin-top:0px;
margin-right:0px;
margin-left:0px;
margin-bottom:0px;

text-align:center;

}

div#content p{line-height:1.4;
}

div#content img{ border:none; 
padding-left:0px;
padding-right:0px;
padding-top:0px;
padding-bottom:0px;

margin-top:0px;
margin-right:0px;
margin-left:0px;
margin-bottom:0px;
}





/*-------------------------------------------------End of Content---------------------------------------------------------*/











/*------------------------------------------------Main Navigation---------------------------------------------------------*/

div#navigation{float:left; width:150px; background:#ffffff; border:#ff0000 solid 1px ;
padding-left:0px;
padding-right:0px;
padding-top:0px;
padding-bottom:0px;

margin-top:0px;
margin-right:0px;
margin-left:0px;
margin-bottom:0px;
 } 
 



#navigation ul
{
list-style-type: none;
text-align: left;
text-indent:0px;

padding-left:15px;
padding-right:0px;
padding-top:0px;
padding-bottom:0px;

margin-top:10px;
margin-right:0px;
margin-left:0px;
margin-bottom:0px;

}

#navigation ul li a {
background: transparent url(http://www.ekmpowershop6.com/ekmps/shops/rajan/images/grey.gif) left center no-repeat;

text-align: left;
font: normal 1em "Lucida Grande", "Lucida Sans Unicode", verdana, lucida, sans-serif;
text-decoration: none;
color: #000000;

padding-left:15px;
padding-right:0px;
padding-top:0px;
padding-bottom:0px;

margin-top:0px;
margin-right:0px;
margin-left:0px;
margin-bottom:0px;
}

#navigation li { 
padding-left:0px;
padding-right:0px;
padding-top:0px;
padding-bottom:5px;

margin-top:0px;
margin-right:0px;
margin-left:0px;
margin-bottom:0px;}



#navigation ul li a:hover
{
background: transparent url(http://www.ekmpowershop6.com/ekmps/shops/rajan/images/red.gif) left center no-repeat;
color: #ff0000;
}

#nnavigation li { 
padding-left:0px;
padding-right:0px;
padding-top:0px;
padding-bottom:5px;

margin-top:2px;
margin-right:0px;
margin-left:0px;
margin-bottom:0px;}

#navigation ul li a#current
{
background: transparent url(http://www.ekmpowershop6.com/ekmps/shops/rajan/images/.gif) left center no-repeat;
color: #666;
}

/*--------------------------------------------End of Main Navigation---------------------------------------------------------*/
















/*-----------------------------------------------Bargain Navigation---------------------------------------------------------*/

div#extra{float:left; clear:left; width:150px; text-align:left; background:#000000; border:#ff0000 solid 1px; border-top:none;
padding-left:0px;
padding-right:0px;
padding-top:5px;
padding-bottom:15px;

margin-top:0px;
margin-right:0px;
margin-left:0px;
margin-bottom:0px;} 


#navcontainerBargains ul
{
list-style-type: none;

padding-left:15px;
padding-right:0px;
padding-top:5px;
padding-bottom:0px;

margin-top:0px;
margin-right:0px;
margin-left:0px;
margin-bottom:0px;


}

#navcontainerBargains ul li a
{
background: transparent url(http://www.ekmpowershop6.com/ekmps/shops/rajan/images/grey.gif) left center no-repeat;
text-align: left;
font: normal 1em "Lucida Grande", "Lucida Sans Unicode", verdana, lucida, sans-serif;
text-decoration: none;
color: #ffffff;

padding-left:15px;
padding-right:0px;
padding-top:0px;
padding-bottom:0px;

margin-top:0px;
margin-right:0px;
margin-left:0px;
margin-bottom:0px;
}

#navcontainerBargains li {text-align:left;
padding-left:0px;
padding-right:0px;
padding-top:5px;
padding-bottom:0px;

margin-top:0px;
margin-right:0px;
margin-left:0px;
margin-bottom:0px;}

#navcontainerBargains ul li a:hover
{
background: transparent url(http://www.ekmpowershop6.com/ekmps/shops/rajan/images/red.gif) left center no-repeat;
color: #ff0000; text-align:left;
padding-left:15px;
padding-right:0px;
padding-top:0px;
padding-bottom:0px;

margin-top:0px;
margin-right:0px;
margin-left:0px;
margin-bottom:0px;
}





/*----------------------------------------End of Bargain Navigation---------------------------------------------------------*/



/*-----------------------------------------------Secure---------------------------------------------------------

div#secure{float:left;clear:left;width:150px; text-align: center} 

div#secure{background:#ffffff; border:#ff0000 solid 1px; text-align:left;
}



--------------------------------------End of Secure---------------------------------------------------------*/








/*-----------------------------------------------------Footer---------------------------------------------------------------*/

div#footer{clear:both; width:100%;  float:left;
padding-left:0px;
padding-right:0px;
padding-top:0px;
padding-bottom:0px;

margin-top:0px;
margin-right:0px;
margin-left:0px;
margin-bottom:0px;} 

div#footer{background: #000000;color: #FFF; text-align:center; vertical-align:middle;


}



#navlist li
{
display: inline;
list-style-type: none;
color: #666666;

padding-left:0px;
padding-right:0px;
padding-top:10px;
padding-bottom:0px;

margin-top:0px;
margin-right:0px;
margin-left:0px;
margin-bottom:0px;
}
 
#navlist a { color:#666666; text-decoration:none;
vertical-align:middle;
padding-left:10px;
padding-right:40px;
padding-top:0px;
padding-bottom:0px;

margin-top:0px;
margin-right:0px;
margin-left:0px;
margin-bottom:0px;
vertical-align:text-top;


}


/*----------------------------------------------End of Footer--------------------------------------------------------------*/



/*----------------------------------------------sizetable--------------------------------------------------------------

#sizetable { border: solid #cccccc 1px;
			font-size: 12px;
			text-align:left;

}

#sizetable th {
	text-align: center;
	background-color:#99ffff;
	color:#000000;
	
}

#sizetable td {border-bottom: solid #cccccc 1px;
				padding-left:10px;
				
}

.sizeon { text-indent: 0px; background-color: #66CCCC; font-weight:bold; color:#FFFFFF;

}

.cartSize { border-top:#cccccc solid 1px; padding-top:5px; text-align:center;
}



---------------------------------------------/sizetable--------------------------------------------------------------*/

/*----------------------------------------------sizetable-------------------------------------------------------------

#sizeGuide { border: solid #cccccc 1px;
			font-size: 10px;
			text-align: center;

}

#sizeGuide th {
	text-align: center;
	background-color:#99ffff;
	color:#000000;
	
}

#sizeGuide td {border-bottom: solid #cccccc 1px;
				
				
}

.sizeGuideon { text-indent: 0px; background-color: #66CCCC; font-weight:bold; color:#FFFFFF;

}

.cartSize { border-top:#cccccc solid 1px; padding-top:5px; text-align:center;
}



---------------------------------------------/sizetable--------------------------------------------------------------*/

.flash { border-left:solid #CCCCCC 1px}

/*----------------------------------------------alsobought-------------------------------------------------------------

#alsobought { text-align:center; border: none;


}

#alsobought th{ text-align:left; border-bottom: solid 1px #CCCCCC;

}

#alsobought td{ text-align: center; border-bottom: solid 1px #CCCCCC; font-size:9px;

}

---------------------------------------------alsobought--------------------------------------------------------------*/


.minicart { border:solid #cccccc 1px; margin-right:5px;

}

A:link    { color: #333366; }
A:active  { color: #333366; }
A:visited { color: #333366; }
Reply With Quote
  #5  
Old May 12th, 2008, 04:36 PM
Kravvitz's Avatar
Kravvitz Kravvitz is offline
CSS & JS/DOM Adept
Click here for more information.
  
Join Date: Jul 2004
Location: USA
Posts: 15,149 Kravvitz User rank is General 5th Grade (Above 100000 Reputation Level)Kravvitz User rank is General 5th Grade (Above 100000 Reputation Level)Kravvitz User rank is General 5th Grade (Above 100000 Reputation Level)Kravvitz User rank is General 5th Grade (Above 100000 Reputation Level)Kravvitz User rank is General 5th Grade (Above 100000 Reputation Level)Kravvitz User rank is General 5th Grade (Above 100000 Reputation Level)Kravvitz User rank is General 5th Grade (Above 100000 Reputation Level)Kravvitz User rank is General 5th Grade (Above 100000 Reputation Level)Kravvitz User rank is General 5th Grade (Above 100000 Reputation Level)Kravvitz User rank is General 5th Grade (Above 100000 Reputation Level)Kravvitz User rank is General 5th Grade (Above 100000 Reputation Level)Kravvitz User rank is General 5th Grade (Above 100000 Reputation Level)Kravvitz User rank is General 5th Grade (Above 100000 Reputation Level)Kravvitz User rank is General 5th Grade (Above 100000 Reputation Level)Kravvitz User rank is General 5th Grade (Above 100000 Reputation Level)Kravvitz User rank is General 5th Grade (Above 100000 Reputation Level) 
Time spent in forums: 3 Months 2 Weeks 2 Days 2 h 47 m 18 sec
Reputation Power: 1294
Huh? I see several XHTML errors. Where's the doctype?

I'm not sure what gap you're talking about, but I see one below the <img> in #header.

These explain why that is happening and how to fix it:
That mysterious gap under images
Images, Tables, and Mysterious Gaps

Why should you avoid using tables for layout?

What is #navcontainerLeft for?
__________________
Spreading knowledge, one newbie at a time.

Learn CSS. | PHP includes | X/HTML Validator | CSS validator | Dynamic Site Solutions

IE7: the generation 7 browser new in a world of generation 8 browsers.
Design/program for Firefox (and/or Opera), apply fixes for IE, not the other way around.
Reply With Quote
  #6  
Old Yesterday, 05:06 AM
si666 si666 is offline
Registered User
Dev Shed Newbie (0 - 499 posts)
  
Join Date: May 2007
Posts: 9 si666 User rank is Just a Lowly Private (1 - 20 Reputation Level) 
Time spent in forums: 2 h 6 m 34 sec
Reputation Power: 0
Still dont get it
Sorry didn’t do a very good job of explaining this you can see on the images where the gap appears in I.E and not in Firefox.

I’ve updated the code in the above post to what I have now, but still have the gap.

Anyone know why? I’ve been dipping in and out of it for days now..
Reply With Quote
Reply

Viewing: Dev Shed Forums > Web Design > CSS Help > WHY WHY don’t they make them work the same????????

« Previous Thread | Next Thread »

Thread Tools  Search this Thread 
Search this Thread:

Advanced Search
Display Modes  Rate This Thread 
Linear Mode Linear Mode
Rate This Thread:


Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts
vB code is On
Smilies are On
[IMG] code is On
HTML code is Off
View Your Warnings | New Posts | Latest News | Latest Threads | Shoutbox
Forum Jump

 Free IT White Papers!
 
Accelerating Trading Partner Performance
One in five. That's how many partner transactions have at least one error. That is an amazing statistic, particularly given the extraordinary leaps in innovation across the global supply chain during the past two decades. Download this white paper to learn more.
 
Competing on Analytics
This Tech Analysis is designed to help identify characteristics shared by analytics competitors, and includes information about 32 organizations that have made a commitment to quantitative, fact-based analysis.
 
Cost Effective Scaling with Virtualization and Coyote Point Systems
An overview of the industry trend toward virtualization, how server consolidation has increased the importance of application uptime and the steps being taken to integrate load balancing technology with virtualized servers.
 
Five Checkpoints to Implementing IP Telephony
Implementation planning for IP PBX software and IP telephony has become vital as businesses replace discontinued legacy PBX phone systems. This informative whitepaper outlines five "checkpoints" for any implementation plan that will help make IP communications a successful proposition.
 
Hosted Email Security: Staying Ahead of New Threats
In the last two years, email has become a fierce battleground between the nefarious forces of spam and malware, and the heroes of messaging protection. The spam volumes increased alarmingly every month, bringing clever new forms of phishing and virus propagation attacks.
 

Forums: » Register « |  User CP |  Games |  Calendar |  Members |  FAQs |  Sitemap |  Support |