Làm cách nào để tạo các phần tử có chiều cao động position:absolute và chiều cao động chiếm không gian dọc bằng chỉ sử dụng css? Có bất kỳ thủ thuật nào với các thùng chứa và hiển thị mà tôi có thể sử dụng không?Không gian dọc trên các phần tử có vị trí: tuyệt đối
Thật không may, sử dụng định vị tuyệt đối nghĩa là theo định nghĩa, phần tử của bạn không còn chiếm dung lượng. Vì vậy, không, chỉ thông qua css không có cách nào để làm điều này.
Bạn có thể sử dụng jQuery (hoặc javascript đơn giản) để thực hiện việc này. Làm thế nào tôi làm điều đó là có một yếu tố space bên cạnh mỗi phần tử dọc. Bao gồm cả phần tử không gian và phần tử dọc được định vị hoàn toàn trong một div vị trí tương đối. Khi tải trang, hãy thay đổi height của phần tử khoảng trống để phù hợp với chiều cao của phần tử dọc.
position: absolute có nghĩa là chúng không chiếm không gian trong luồng. Tuy nhiên, bạn không cần phải tạo hiệu ứng sử dụng ký quỹ, bạn có thể sử dụng float để cho các phần tử chiếm bất kỳ khoảng trắng nào và tạo mỗi phần tử position:relative.
div.animate-me {
width: 300px;
margin: 20px;
float: left;
left: -1000px; // Make them start offscreen
position: relative;
border: 1px solid red;
visibility: hidden
}
$('div').css().animate({
left: 0
});
'vị trí: absolute' có nghĩa là họ không chiếm không gian trong dòng chảy. Xin vui lòng gửi một ví dụ về những gì bạn đang cố gắng để làm –
Tôi đang làm động một loạt các div từ phải sang trái trong js bằng cách sử dụng các vị trí, nhưng cấu trúc có thể bởi bất cứ điều gì. Tôi đã tự hỏi nếu có thể có một mẹo không hợp pháp để làm cho nó sử dụng không gian dọc (có lẽ không) – Yisela