html - vertical and horizontal center of an image -
I have an image in which I need to stand in center and also horizontally! I have tried to do tutorial online that tries to use 'verticle-align' but I can not seem to work on it Here's my code.
CSS
img.logo {display: block; Margin-left: auto; Margin-right: auto; Max-width: 300px; } .s1 {background-color: #FFF; Height: 100vh; } HTML
& lt; Section class = "s1" data-scroll-index = '0' & gt; & Lt; Div id = "wrapper" & gt; & Lt; Img src = "picture / logo.jpg" category = "logo" & gt; & Lt; / Div & gt; & Lt; / Section & gt;
Try this CSS with your existing HTML:
Img.logo {Display: Block; Margins: Auto; Max-width: 300px; Top: 0; Bottom: 0; Left: 0; Correct: 0; Status: Completed; } .s1 {background-color: #FFF; Height: 100vh; Status: Relative; }
Comments
Post a Comment