Skip to main content
Participant
March 19, 2021
Question

Moving images through css

  • March 19, 2021
  • 2 replies
  • 282 views

I'm trying to move an image and add padding and margins through css, but I can't  connect that command to the image. I'm basically putting a command and not moving any images.

    This topic has been closed for replies.

    2 replies

    Nancy OShea
    Community Expert
    Community Expert
    March 19, 2021

    What is the CSS selector name you're using to target your image? 

    #IDs are unique and can be used only 1 x per page.  However .classes are less specific and can be re-used as often as needed.

     

    #uniqueID {

         padding 5%;

         margin-left: 25px;

    }

     

    .thumb {

         border: 10px solid #FFF;

         box-shadow: 2px 3px 1px #333;

    }

     

    HTML:

    <img id="uniqueID" class="thumb" src="my_awesome_image.jpg" alt="description">

     

    Nancy O'Shea— Product User & Community Expert
    Nancy OShea
    Community Expert
    Community Expert
    March 19, 2021

    I forgot to mention, after editing code you will need to save all documents with Ctrl / Cmd + S and hit F5 to refresh Live view.

    Design view is not 100% accurate at rendering.

     

    Nancy O'Shea— Product User & Community Expert
    B i r n o u
    Legend
    March 19, 2021

    without seeing your code, it's pretty complex to figurate what the problem can be and help you efficiantly.

    here some helfull links about block (be aware that by default an IMG tag is an inline object and so, not display as block)

    MDN about IMG tag

    then about margin and passing

    from CSS Tricks

    from MDN