Search code examples
htmlcsscenterdivision

how to center Items that are not in div or span in html/css


I sometimes build my html website and need to add few things after i finish which i didnt expect to put at the beginning for example like an image between the lines so i just opem img tag and put the image without putting it in a div or span. so the problem is i dont know how to center it then. Is there anyway to center an item that doset have a parent container? here is an example code

<html><img src="img.jpg" alt="img"></html> <style>text-align: center;</style>

the problem with this code is that it dosent center anything I also tried to use literly all properties that can center like "justify-content: center; or align-items: center;" but the img dosent move at all and I only can move it by using padding or margin which is not the best way to do.

Does anyone have an Idea of how i can center an item that dosent have an parent Container like div or this dosent work in html/css?


Solution

  • You can define the display property as "flex".

    <html><img src="img.jpg" class="Myimg"></html>
    
    .Myimg
    {
    display: flex;
    justify-content: center;
    }