#1
  1. No Profile Picture
    Contributing User
    Devshed Novice (500 - 999 posts)

    Join Date
    Mar 2008
    Posts
    769
    Rep Power
    41

    centering an svg


    Hi,I can't seem to center an svg image on a page.

    the image is the diamond logo in the top center of the body in the links below.

    you can see the site here

    and I implemented different css: here

    let me know.

    thanks
    Last edited by lelales; October 30th, 2016 at 10:49 PM. Reason: more info
  2. #2
  3. Lazy Moderator
    Devshed Supreme Being (6500+ posts)

    Join Date
    Mar 2007
    Location
    Washington, USA
    Posts
    16,436
    Rep Power
    9645
    You have a
    Code:
    img[src*=".svg"] { height: 150%; }
    that increases the size of the image to 486x165, which overflows your 330x110 #logo-div.

    You should take the time to learn how to use your browser's developer tools because then you can identify problems like this quite easily.
  4. #3
  5. No Profile Picture
    Contributing User
    Devshed Novice (500 - 999 posts)

    Join Date
    Mar 2008
    Posts
    769
    Rep Power
    41
    Hey requinix, yes, I use the developer tools. I kind of took over a theme, didn't develop it from scratch, so lot's of little oddities here and there that I have to figure out.

    Thanks for the info, as that helped on one part, but has side effects for other parts.

    Peace!! Got to get this done and get paid.!! : )
  6. #4
  7. No Profile Picture
    Registered User
    Devshed Newbie (0 - 499 posts)

    Join Date
    Jan 2017
    Location
    Ahmedabad
    Posts
    17
    Rep Power
    0
    Hi,

    You can change in main css the below tag

    Code:
    img[src*=".svg"] 
    {
     height: 100%;
        margin-top: 100%;
    }

IMN logo majestic logo threadwatch logo seochat tools logo