The problem of negative numbers being hidden when margin-bottom is set under IE6_html/css_WEB-ITnose

WBOY
Release: 2016-06-24 11:55:19
Original
1324 people have browsed it

Think of these tabs, the desired effect is as follows

But the bottom border of the current tab in IE6 It will not cover the bottom border of the parent element. It is said on the Internet that the parent element has to start haslayout, but it doesn't work. Finally, set margin-bottom:-1px; position:relative; in the tab element at the same time to solve the problem.

What should be noted here is that the height of the tab element must be 1px greater than the height of the parent element.

My code is as follows:

<ul class="tabs">        <li class="tab cur"><a href="?id=435">?????? ???????</a></li>        <li class="tab "><a href="?id=434">????????????</a></li>    </ul>
Copy after login

 

ul.tabs{display:block; padding:0 10px 0 0; margin:25px 0 0 0; height:35px; border-bottom:solid 1px #ccc; line-height:35px;}ul.tabs li{display:block; float:right; padding:0 10px; margin:0; list-style:none;}ul.tabs li.cur{ border:solid 1px #ccc; border-bottom-color:#fff; background-color:#fff; height:34px; margin-bottom:-1px; position:relative;}
Copy after login

 

source:php.cn
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template
About us Disclaimer Sitemap
php.cn:Public welfare online PHP training,Help PHP learners grow quickly!