14 replies

Can't center div vertically.

Hello! I managed to center my car div horizontally but can't center vertically. Please help!

<body>
        <div class="card">
            <img src="images/image-product-desktop.jpg" alt="Product">
            <div class="details">Some text here</div>
        </div>
</body>

<body>
        <div class="card">
            <img src="images/image-product-desktop.jpg" alt="Product">
            <div class="details">Some text here</div>
        </div>
</body>

*{
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

body{
    margin: 0;
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: hsl(30, 38%, 92%);
}

.card{
    display: flex;
    width: 300px;
}


.card img{
    width: 50%;
}

*{
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

body{
    margin: 0;
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: hsl(30, 38%, 92%);
}

.card{
    display: flex;
    width: 300px;
}


.card img{
    width: 50%;
}

KP-C

Kevin Powell - Community•4y ago•

14 replies

Shayokh

Can't center div vertically.

Hello! I managed to center my car div horizontally but can't center vertically. Please help!

<body>
        <div class="card">
            <img src="images/image-product-desktop.jpg" alt="Product">
            <div class="details">Some text here</div>
        </div>
</body>

<body>
        <div class="card">
            <img src="images/image-product-desktop.jpg" alt="Product">
            <div class="details">Some text here</div>
        </div>
</body>

*{
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

body{
    margin: 0;
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: hsl(30, 38%, 92%);
}

.card{
    display: flex;
    width: 300px;
}


.card img{
    width: 50%;
}

*{
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

body{
    margin: 0;
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: hsl(30, 38%, 92%);
}

.card{
    display: flex;
    width: 300px;
}


.card img{
    width: 50%;
}

Can't center div vertically.

Similar Threads

Can't center div vertically.

Similar Threads

Similar Threads

Similar Threads