Jump to content

Ie6 Div Gap


juice1
 Share

Recommended Posts

I have a problem with ie6, heres the code:

<div class="whatsNew">		<div class="centre"><h2>What's New</h2></div>	</div>		<div class="table">		<div class="centre">			<h3 class="latestNews">Latest News</h3>						<h4 class="top">Lorem Ipsum is simply dummy text of the printing</h4>			<p class="latestDesk">Lorem Ipsum is simply dummy text of the printing</p>						<h4>Lorem Ipsum is simply dummy text of the printing</h4>			<p class="latestDesk">Lorem Ipsum is simply dummy text of the printing</p>						<h4>Lorem Ipsum is simply dummy text of the printing</h4>			<p class="latestDesk">Lorem Ipsum is simply dummy text of the printing.</p>						<h4>Lorem Ipsum is simply dummy text of the printing</h4>			<p class="latestDesk">Lorem Ipsum is simply dummy text of the printing.</p>						<h4>Lorem Ipsum is simply dummy text of the printing</h4>			<p class="latestDesk">Lorem Ipsum is simply dummy text of the printing.</p>						<h4>Lorem Ipsum is simply dummy text of the printing</h4>			<p class="latestDesk">Lorem Ipsum is simply dummy text of the printing.</p>						<h3 class="forthcomingEvents">Forthcoming Events</h3>						<h4 class="top">Lorem Ipsum is simply dummy text of the printing</h4>			<p class="eventsDesk">28 Jul 09, Bristol</p>						<h4>Lorem Ipsum is simply dummy text of the printing</h4>			<p class="eventsDesk">28 Jul 09, Bristol</p>						<h4>Lorem Ipsum is simply dummy text of the printing</h4>			<p class="eventsDeskBottom">28 Jul 09, Bristol</p>			</div>	</div>

.whatsNew, .table h4, .latestNews, .forthcomingEvents, .latestDesk, .eventsDesk, .eventsDeskBottom {	font-family:Arial, Helvetica, sans-serif;}.latestNews, .forthcomingEvents {	font-size:14px;}.table h4, .latestDesk, .eventsDesk, .eventsDeskBottom {	font-size:12px;}/***************//*** TOP DIV ***//***************/.whatsNew {	background:url(http://img140.imageshack.us/img140/1604/whatsnew.gif) no-repeat;	color:#84837E;	margin:0;	padding:0;	width:224px;	height:45px;}/******************//*** BACKGROUND ***//******************/.table {	margin:0;	padding:0;	background-color:#F1F1EE;	width:222px;	border:1px solid #CCCCCC;	border-top:none;	/* The background */}.centre {	margin:0 auto;	padding:0;	width:195px;	/* To align text to the centre of column */}/****************//*** HEADINGS ***//****************/.latestNews {	color:#007597;	margin:0;	padding:5px 0;}.forthcomingEvents {	color:#CC6600;	margin:0;	padding:0;	border-top:1px solid #CCCCCC;}/**************//*** TITLES ***//**************/.table h4 {	color:#333333;	margin:0;	padding:0;	border-top:1px solid #CCCCCC;}.table .top {	border:none;}/*****************//*** PARAGRAPH ***//*****************/.latestDesk {	color:#666666;	margin:0;	padding:0;	border-bottom:1px solid #FFFFFF;}.eventsDesk, .eventsDeskBottom {	font-style:italic;	color:#666666;	margin:0;	padding:0;	border-bottom:1px solid #FFFFFF;}.eventsDeskBottom {	border:none;}

basically there is a small gap in ie6 between the .whatsnew and the .table and i cant seem to get rid of it. my padding and margins are set to 0 where they should be and i've also tried setting the img to no padding and margin but still doesnt work. This only shows up in ie6 (havent tried ie7).Does anyone know what the problem is?Thanks

Edited by juice1
Link to comment
Share on other sites

I would focus your testing on more current, modern, standards-oriented browsers like FF3, Safari, IE8/7. I also can't tell if you have a doctype or if your page passes validation.my guess is because of the <h2> tags, or maybe the height of your image?

Link to comment
Share on other sites

Aaahh the h2 tag!Thanks! I can't believe I didn't do that!My thoughts are the same as yours but for this project I have to test for ie6 as well unfortunately. I do have a doctype, just didnt occur to me to paste it in too!Thanks again

Link to comment
Share on other sites

My thoughts are the same as yours but for this project I have to test for ie6 as well unfortunately. I do have a doctype, just didnt occur to me to paste it in too
testing for IE6 is fine, I wouldn't make it the first barrier to entry, that's all. I would get it to work on the modern browsers, and then add legacy support in the way of hacks or separate stylesheets.
Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
 Share

×
×
  • Create New...