Dự án (tiếp tục)
Tiếp theo, bạn sẽ thêm một quy tắc cho tất cả information boxes để rằng chúng được đặt bên
trong phần tử main sử dụng absolute positioning.
Để position các information boxes:
1. Quay trở lại file pc_info.css trong editor của bạn và cuộn xuống phần Inforgraphic Styles.
2. Thêm quy tắc style sau để thiết lập dạng position của tất cả information boxes.
div.infobox {
position: absolute;
}
3. Position information box đầu tiên 20 pixels từ lề đỉnh của cái chứa của nó và 5 % từ lề trái.
div#info1 {
display: block;
top: 20px;
left: 5%;
}
Chú ý rằng chúng ta thiết lập đặc tính display thành block để rằng information box đầu tiên không
còn ẩn khỏi trang.
4. Lưu thay đổi của bạn vào file và sau đó reload lại file pc_info.html trong trình duyệt của bạn.
Ảnh dưới thể hiện vị trí của information box đầu tiên.
