Cấp bậc tác giả:

HTML

Chiều rộng thẻ DIV tự co giản theo nội dung

Được viết bởi QuangIT ngày 21/11/2012 lúc 02:48 PM
Tình hình là thẻ DIV nếu ko fix chiều rộng cố định nó sẽ tràn như 100%. Nhưng nếu fix chiều rộng cố định như trường hợp trên thì bất tiện như ví dụ dưới đây.
  • 0
  • 12495

Chiều rộng thẻ DIV tự co giản theo nội dung

Tình hình là thẻ DIV nếu ko fix chiều rộng cố định nó sẽ tràn như 100%. Nhưng nếu fix chiều rộng cố định như trường hợp trên thì bất tiện như ví dụ dưới đây.
1. Chiều rộng mặc định:
HTML:
<div clas="dngaz"><img src="... /></div>
 
CSS:
.dngaz
{
 border: 3px solid blue;
 padding:10px;
}
2. Chiều rộng cố định:
HTML:
<div clas="dngaz"><img src="... /></div>
 
CSS:
.dngaz
{
width:100px;
padding:10px;
border: 3px solid blue;
}

Mình thêm thuộc tính display: table; ko cần fix chiều rộng.

Lúc này ví dụ trên có thể viết như sau:
 
3. Chiều rộng tự co giản theo nội dung:
HTML:
<div clas="dngaz"><img src="... /></div>
 
CSS:
.dngaz
{
display:table;
*float:left; /* IE7 trở về trước;
padding:10px;
border: 3px solid blue;
}

Nguồn bài viết: Dngaz.com

BÌNH LUẬN BÀI VIẾT

Bài viết mới nhất

LIKE BOX

Bài viết được xem nhiều nhất

HỌC HTML