dạo này đang học HTML/CSS cơ bản, làm tới đoạn này thì cứ bị lỗi chữ đẩy lên phía trên, lay hoay mãi không biết fix thế nào, bác nào rành thì giúp mình edit hộ với T_T Hình Spoiler Phần bị lỗi Bài yêu cầu Html Spoiler <html> <head> <meta charset="utf-8" /> <title>Bai 02</title> </head> <link rel="stylesheet" type="text/css" href="../CSS/common_lamnqps03509.css"> <body> <div id=wrapper> <div id=left> <div id=header> <div class="hd1"> <h1> THẾ GIỚI DI ĐỘNG HCM </h1> </div> <div class="hd2"> <h2> Tin Tức Công Nghệ </h2> </div> </div> <div id=content> <div class="img"><img src="../Image/Bai02/anh01_lamnqps03509.jpg" width="147" height="98" hspace="8" vspace="18" align="left"><p> Instagram đã có phiên bản dành cho Android (CafeF1.com) Instagram là ứng dụng chụp ảnh được ưa chuộng nhất trên iOS, nay đã có mặt trên Android. Ngay từ bây giờ người dùng có thể tải Instagram miễn phí từ Google Play.</p></div> <div class="img"><img src="../Image/Bai02/anh02_lamnqps03509.jpg" width="147" height="98" hspace="8" vspace="18" align="left" ><p>K-Touch K1 – “siêu điện thoại” cho người lớn tuổi CafeF1.com) K-Touch K1 hướng đến nhóm đối tượng người dùng cao tuổi có thiết kế phù hợp như bàn phím số lớn, có hướng dẫn bằng giọng nói, thao tác sử dụng trên giao diện máy cũng rất đơn giản và thân thiện.</p></div> <div class="img"><img src="../Image/Bai02/anh03_lamnqps03509.jpg" width="147" height="98" hspace="8" vspace="18" align="left"><p>Những smartphone được mong chờ nhất tháng 4 (CafeF1.com) Trong tháng 4 này hứa hẹn nhiều smartphone đa dạng từ cấu hình cho đến giá cả. Trong số đó model của HTC được người dùng mong đợi nhất, tiếp đến là dòng Lumia của Nokia, rồi đến smartphone giá rẻ của LG.</p></div> </div> <div id=footer> <h3>Địa chỉ: 391A Nam Kỳ Khởi Nghĩa<br> Điện thoại: 0987844858</h3> </div> <div id=right> </div> </div> </body> </html> CSS Spoiler @charset "utf-8"; /* CSS Document */ #wrapper { width: 900px; height: 500px; margin-left:auto; margin-right:auto; } #left { width:600px; height:500px; float:left; } #right { witdh:300px; height:500px; float:left; } #header { width:600px; height:40px; } #content { width:600px; height:400px; } #footer { width:600px; height:60px; background-color:#F90; } .hd1 { background-color:#F90; padding: 5px; } .hd2 { background-color:#FFC; padding:1px; } h1 { font-size:28px; text-align:center; color:#FFF; } h2 { font-size:24px; text-align:center; color:#F36; } h3 { font-size:20px; text-align:left; color:#FFF; padding: 2px; margin: 2px; } p { font-size: 16px; } .img { width:600px; float:left; padding:5px; margin:5px; } cám ơn mấy bác
https://www.izwebz.com/video-tutorials/misc/cac-series-nen-xem-tren-izwebz-cho-newbie/ Tặng bác series này rất bổ ích cho người mới học html và css
code nhìn tởm quá , chả muốn sửa , nói chung viết lại 3 cái tin ngắn đó thành 1 class cho vào 3 div đi rồi xem tiếp :/ với dùng clear fix sau div header thử
http://codepen.io/anon/pen/JYXeJr Bạn bỏ định nghĩa height ở #header, #content, #footer nhé, để độ cao được quy định bởi content. Các thẻ div chứa ảnh thì bỏ float, để float: left vào ảnh bên trong, còn div.img thì thêm clearfix.
cho cái div header ra ngoài ngang cap voi div left là đc nhé , đặt height cho cái #header nữa bỏ hết cái đống css right,left đi http://jsfiddle.net/iceball/2xwnzygg/