WEB/CSS

[CSS]페이지 크기 조절 시, 요소들이 자동 개행 될 때

developer of the night sky 2023. 9. 27. 15:10

 

인라인 태그들은 화면 조절될 때 크기를 못맞추면 자동 개행이 된다.

자동개행

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>

    <link rel="stylesheet" href="css/ex44.css">
</head>
<body>
    
    <nav id="main-menu">
        <img src="../asset/images/rect_icon01.png">
        <img src="../asset/images/rect_icon02.png">
        <img src="../asset/images/rect_icon03.png">
        <img src="../asset/images/rect_icon04.png">
        <img src="../asset/images/rect_icon05.png">

    </nav>
</body>
</html>
#main-menu {
    border: 1px solid black;
    font-size: 0;
}

 

크기를 지정해주면 자동개행되지 않는다.

 

#main-menu {
    border: 1px solid black;
    font-size: 0;

    width: 630px;
}