How to use CSS to center irregular pictures on the page?

Discussion in 'HTML & Website Design' started by Gertrude, Sep 26, 2021.

0
  1. #1
    I have a rectangular picture. How can I display the picture in the middle of the page by using CSS
     
    Gertrude, Sep 26, 2021 IP
  2. shalom_m

    shalom_m Member

    Messages:
    49
    Likes Received:
    12
    Best Answers:
    0
    Trophy Points:
    33
    #2
    For horizontal centering use these lines below

    Inside the <head> or your external CSS file:
    <style>

    .HorizontalCentering {
    display: block;
    margin-left: auto;
    margin-right: auto;    ​
    }​

    </style>

    Inside the <body>:
    <img class= "HorizontalCentering" src="path/picture.jpg" alt="description of picture" style="width:60%">​
     
    shalom_m, Nov 19, 2021 IP