'How to center a element into a div into another div [duplicate]
.header_main_page_portal {
background-color: white;
height: 80px;
width: 100%;
}
.image_login_portal {
width: 500px;
}
.image_login_portal img {
margin: auto;
display: block;
}
.title_main_page {
justify-content: center;
display: flex;
margin: 0 auto;
width: 100%;
}
<div class="header_main_page_portal">
<div class="image_login_portal">
<img src="http://127.0.0.1:8000/storage/diba/images/logo-portal.png" class="logo-nav_portal_main_page" alt="logo-client">
</div>
<div class="title_main_page">
<h6>PÀGINA PRINCIPAL</h6>
</div>
</div>
I have a div that acts as a header, occupying 100% of the width of the screen.
Inside this div, I have another one with the logo on the left side.
Next to this I have another div with an h6 centered inside this last div.
My problem is that the title div starts when the photo ends, so the h6 doesn't appear centered on the screen. Although it is inside the div.
<div class="header_main_page_portal">
<div class="image_login_portal">
<img src="XXXX" class="logo-nav_portal_main_page" alt="logo-client">
</div>
<div class="title_main_page">
<h6>MAIN PAGE</h6>
</div>
</div>
Thanks!! :D
Sources
This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.
Source: Stack Overflow
Solution | Source |
---|