css - Unwanted margin issue in Internet Explorer 7 -


i have weird problem in internet explorer 7 shows heading lot of distance top. problem not exists in other browsers or newer versions of ie.

what should make right?

chrome version:
most of browsers show should show!
ie 7 version:
ie puts space above title.

html

<div class="box">     <header class="module-title">         <h2 class="title">گزارش و مصاحبه</h2>     </header>     <section class="module-content">         <ul class="sidebar-news">             <li>                 <div class="image-holder">                     <img src="img.jpg" alt="test item">                 </div>                 <h3><a class="moduleitemtitle" href="#">copy of مصاحبه با معاون صدا درباره راديو كتاب</a></h3>                 .                 .                 .              </li>         </ul>     </section> </div> 

css

.module-title h2 { margin-top: 0; font-size: 26px; line-height: 30px; }  .sidebar-news { list-style: none; margin: 0; } .sidebar-news h3 { font-size: 20px; line-height: 26px; margin-top: 0; } .sidebar-news .image-holder { width: 140px; float: right; margin-left: 10px; } 

update 1: fixed giving *margin: -20px; .sidebar-news h3 don't solution! why happening? there adding gap?

you need apply float property achieve in ie7.

.module-title h2 { margin-top: 0; font-size: 26px; line-height: 30px; }  .sidebar-news { list-style: none; margin: 0; border:1px solid red; float:left; } .sidebar-news .image-holder{ float:right;} .sidebar-news h3 { font-size: 20px; line-height: 26px; margin:0px; padding:0px; float:left; } .sidebar-news .image-holder { width: 140px; float: right; margin-left: 10px; } 

Comments

Popular posts from this blog

c# - DetailsView in ASP.Net - How to add another column on the side/add a control in each row? -

javascript - firefox memory leak -

Trying to import CSV file to a SQL Server database using asp.net and c# - can't find what I'm missing -