10/10/2018, 10:37

[help] định dạng css menu không hoạt động trên ie6

sau khi định dạng css cho menu thì nó bị lỗi xuống dòng có khoảng trắng trên ie6 , bạn nào bít lỗi này giúp mình với
code html

<div id="div_lon_nhat_menu_doc">
<ul>
<li><a href="#">Trang chủ</a></li>
<li><a href="#">Menu 1</a>
<ul>
<li><a href="#">Menu 1.1</a></li>
<li><a href="#">Menu 1.2 dai dai dai dai dai dai dai dai dai dai</a>

</li>
<li><a href="#">Menu 1.3 dai dai dai dai dai</a></li>
<li><a href="#">Menu 1.4</a></li>
<li><a href="#">Menu 1.5</a></li>
<li><a href="#">Menu 1.6</a></li>
<li><a href="#">Menu 1.7</a></li>
<li><a href="#">Menu 1.8</a></li>
</ul>
</li>
<li><a href="#">Menu 2 dai</a></li>
<li><a href="#">Menu 3</a>

</li>

</ul>
</div>

code css

div#div_lon_nhat_menu_doc
{

width:170px;
height:auto;
text-align:left;
/*background-image:url('hinhanh/8.jpg');*/
background:#414141;
}
div#div_lon_nhat_menu_doc ul
{

list-style:none;
margin-left:0px;
padding-left:0px;

}
div#div_lon_nhat_menu_doc ul li
{
position:relative;

width:auto;
z-index:1;
}
div#div_lon_nhat_menu_doc ul li a
{

display:block;
padding-right: 10px;
padding-left: 10px;

text-align:left;
width:150px;
height:auto;
text-decoration: none;

border:1px solid #778;
border-top:0px solid #778;

background:#ececec;

}
div#div_lon_nhat_menu_doc ul li ul
{
position:absolute;
left:171px;
top:0px;
}

xcode viết 12:51 ngày 10/10/2018

bây giờ đâu ai xài IE 6 nữa

dokhacluan viết 12:39 ngày 10/10/2018

bữa hổm ra chơi tiệm net , thấy còn xài hihi
ie6 mức cuối rồi , từ ie6 trở xuống không test nữa
nhưng lớn hơn hoặc bằng ie6 thì vẫn chơi
ông có cách nào không

tabvn viết 12:53 ngày 10/10/2018

Được gửi bởi xcode

bây giờ đâu ai xài IE 6 nữa

psd to xhtml, html css, cliens vẫn yêu cầu với IE6. Chưa bỏ được đâu bạn.

binhcx1989 viết 12:51 ngày 10/10/2018

Nhìn cái đống code HTML đã sợ ko muốn giúp roài,viết lồng tận 4 cái ul với nhau lận @@

dokhacluan viết 12:39 ngày 10/10/2018

chứ viết 1 cấp menu thì nó đâu bị lỗi , cấu trúc html phái trên tớ viết 2 dài nhưng là dễ thấy trên cái free menu js mà tớ bắt truoc html của nó đó ul li lồng nhau

hoặc dã cậu viết lại 2 cấp menu đi

đang nhức đầu quá , ai bít giúp với

honnhienh viết 12:47 ngày 10/10/2018

hôg biết bác dùng cái gì phát sing ra cái html mà nhìn song chống mặt. lần sau bác lên rút gọn nó rùi và chình lại chút rùi post lên. zaayj anh em load về coi song cũng đuối.

linh040800 viết 12:40 ngày 10/10/2018

Mình có test qua IE 5.5 rồi nhìn còn chán nữa..hihi
Cậu thủ sửa đoạn code thành :

Code:

div#div_lon_nhat_menu_doc ul li
{
position:relative;
width:auto;
border:1px solid green;
/*z-index:1;*/
}

CŨng không biết có đúng không nữa vì menu nhiều cấp quá..hihi
Và một điều nữa tớ không hiểu cậu cho cái z-index:1; vào tác dụng của nó để làm gì

[=========> Bổ sung bài viết <=========]

Mình thử edit lại với file HTML thành kiểu viết phân cấp nhìn thấy 7 cái UL lồng nhau, không thể quan sát nổi. Bài khó quá cậu ơi

dokhacluan viết 12:41 ngày 10/10/2018

@linh040800 : tự nhiên sữa boder thành 1px , khoảng trống đó mất đi
kì lạ thật , tại sao vậy

@all : cái đoạn html giống với cách bố trí của free menu css js , đoạn ul li lồng nhau cũng thường thấy mà , mình đã rút gọn lại rồi đó

[=========> Bổ sung bài viết <=========]

tuanit85 viết 12:47 ngày 10/10/2018

@dokhacluan : Cách viết CSS của bạn vô cùng cẩu thả, chỉ mang tính chất viết để cho nó hiển thị là đủ mà không quan tâm đến việc viết có đúng cách hay không, viết làm sao để có thể dễ dàng chỉnh sửa khi cần. Dưới này mình Post code mình đã sửa lại để bạn tham khảo thôi.

Code:

*{
margin:0px;
padding:0px;
}

div#div_lon_nhat_menu_doc{
width:170px;
height:auto;
background:#414141;
}

div#div_lon_nhat_menu_doc ul{
width:168px;
height:auto;
border-top:1px solid #778;
border-left:1px solid #778;
border-right:1px solid #778;
}

div#div_lon_nhat_menu_doc ul li{
position:relative;
width:148px;
height:25px;
line-height:25px;
list-style:none;
text-align:left;
padding:0px 10px;
background:#ececec;
border-bottom:1px solid #778;
}

div#div_lon_nhat_menu_doc ul li a{
font-family:tahoma;
font-size:12px;
color:#000000;
text-decoration: none;
}

div#div_lon_nhat_menu_doc ul li ul{
position:absolute;
left:168px;
top:-1px;
display:none;
}

div#div_lon_nhat_menu_doc ul li:hover ul{
display:block;
}

Bình luận về bài viết này

Chia sẻ tin đăng đến bạn bè

Gửi Messenger

Bài liên quan

dokhacluan

0 chủ đề

0 bài viết

Tác giả nổi bật