简体   繁体   中英

link causes line spacing issue in IE

I have a paragraph of text. If the text is longer than the set length a link "read more" is added on the end. The problem I have in IE is that it forces the line that the link is on to separate from the line above making it look odd. IT only happens in IE.

Here is the link to where it is happening: http://www.melfordschoolofmotoring.co.uk/test.php

What am i missing to stop the extra margin at the top of the line with the link in it?

if(mysql_num_rows($query)>0){
        //There are testimonials to retrieve from Database
        while($row = mysql_fetch_assoc($query)){
            $test = htmlentities($row['test']);
            $firstname = htmlentities($row['fn']);
            $surname = htmlentities($row['sn']);
            $date = date('d/m/Y',strtotime($row['date']));
            $form_test = '';

            if(strlen($test) > 180){
                $form_test .= substr($test,0,181);
                $form_test .= '<a href="test_more.php">...read more</a>';
            }else if(strlen($test)<180){
                $form_test .= $test;
            }
            echo '<div class="text_module_test"><!-- wraps each part of text in to a nice module -->';
            echo '<p>'.$form_test.'</p>';
            echo '<div class="test"><p>by '. $firstname .' '. $surname .' '. $date .'</p></div>';
            echo '</div>';
        }
    }else{
        //There aren't any testimonials in Database
        echo '<p>There are currently no testimonials to display.</p>';
    }

    .text_module_test{
border:1px solid #6a77fa;
background-color:#e1e4fe;
padding:10px;
margin:20px 0 0 0;
width:350px;
min-height:90px;
text-align:justify;
overflow:hidden;
}
.text_module_test p{
margin:0;
}
.text_module_test a:link, .text_module_test a:visited{
font-size:12px;
padding:0;
margin:0;
text-decoration:none;
color:#777caa;
}
.text_module_test a:hover{
color:#000;
font-size:12px;
padding:0;
margin:0;
}
.test{
padding:5px;
margin:0 20px 0 0;
width:340px;
height:10px;
text-align:right;
}
.test p{
font-size:10px;
margin: 0;
}

Looks like this is due to line-height: 34px; for .menu_item a:link, a:visited in menu.css . Add line-height: 100%; for .text_module_test a:link, .text_module_test a:visited in style.css to override this rule.

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM