Yêu cầu thg 12 12, 2019 2:18 CH 1107 0 3
  • 1107 0 3
0

Làm thế nào để các div tự động cao bằng nhau

Chia sẻ
  • 1107 0 3

Mình có các khối div như thế này. Sau khi đổ dữ liệu, các khối div sẽ lệch nhau. Làm thế nào để các div tự động co giãn bảng nhau? Nhờ các bác giúp đỡ, minh xin cảm ơn. Mình đã thử height: 100% nhưng k dc. Hoặc các bác có từ khóa, link hướng dẫn nào cho mình xin ạ.

3 CÂU TRẢ LỜI


Đã trả lời thg 12 12, 2019 2:43 CH
+4

Nếu bác dùng display: flex thì sử dụng cùng với align-items: stretch để kéo các item trong div đó cùng chiều cao

Chia sẻ
Đã trả lời thg 12 26, 2019 10:15 SA
+1

Bạn có thể nhét vào 2 cột của table mà vì 2 cột của 1 table nó luôn bằng nhau.

<style>
    .left{
        height: 100%;
        background: red;
        width: 500px;
    }
    .right{
        background: blue;
        width: 500px;
        height:100%;
    }
    .table-test{
        height: 500px;
    }
</style>
<body> <table class="table-test"> <tr> <td>
            </div>
        </td>
        <td>
            <div class="right">
            
            </div>
        </td>
    </tr>
</table>
</body>
Chia sẻ
Avatar hieu nguyen @hieuhumg
thg 12 27, 2019 3:02 SA

cảm ơn bác, rất hay

Avatar Quang Tú @caoquangtu
thg 12 27, 2019 9:57 SA

Trước em cũng gặp trường hợp này rồi nên em biết bác ạ =))

Đã trả lời thg 12 12, 2019 2:19 CH
0

co theo chiều cao hay rộng thế bạn ???

Chia sẻ
Avatar hieu nguyen @hieuhumg
thg 12 12, 2019 2:23 CH

Tức là khí kéo dãn màn hình thì nó vẫn tự co bằng nhau ấy bác, hiện tại co giãn nó bị lệch, hoặc khi dữ liệu 1 div nhiều hơn thì nó sẽ cao hơn div.png

thg 12 12, 2019 2:24 CH

@hieuhumg bạn có thế them khảo luôn ví dụ này nhé https://www.w3schools.com/howto/howto_css_equal_height.asp

Avatar hieu nguyen @hieuhumg
thg 12 12, 2019 2:26 CH

@HuyDQ ồ thank bác, đúng thứ cần tìm, cái này làm dc vs flex k bác. Cảm ơn bác nhiều

thg 12 12, 2019 2:29 CH

@hieuhumg nếu bạn dùng flex chỉ để các cột ở cạnh nhau thôi thì có thể dùng thuộc tính display: table như trong ví dụ trên và nội dung bên trong đó bạn để display: table-cell thì nó sẽ tự động nằm cạnh nhau

Avatar hieu nguyen @hieuhumg
thg 12 12, 2019 4:27 CH

@HuyDQ alo bác ơi, cái này cùng div ms làm dc, khác div thì chịu

thg 12 12, 2019 5:16 CH

@hieuhumg bạn có thể show demo cấu trúc div hiện tại của bạn không

Viblo
Hãy đăng ký một tài khoản Viblo để nhận được nhiều bài viết thú vị hơn.
Đăng kí