Resize SVG and Chrome Render Problem

  • Resolved cholocarlos

    (@cholocarlos)


    7 years, 10 months ago

    Hello! I love your plugin. Makes it easy for users to use SVG and have beautiful logos and images in their website!

    I have used SVG for my site logo but I can’t resize it properly. I tried CSS targeting the logo div but it resized the whole div. So I removed the custom CSS and now it takes up the whole page width.

    Also, it renders fine on Safari and Firefox. But no go for Chrome.

    Any suggestions and ideas? Thank you so much!

    The page I need help with: [log in to see the link]

Viewing 7 replies - 1 through 7 (of 7 total)
  • Plugin Author Benbodhi

    (@benbodhi)

    7 years, 10 months ago

    Hey, thanks for the kind feedback 🙂

    I can’t actually see your logo at all in Chrome…
    The source has a lot of spaces in it which is weird too.

    src="				https://forexvps.cc/wp-content/uploads/2018/08/Test_Logo.svg"

    As for the sizing of it, you just need to use more specificity than existing CSS. This should do it:

    .header-image .logo-inner div#logo img {
	width: 50%;
}

    Let me know how you go.

    • This reply was modified 7 years, 10 months ago by Benbodhi. Reason: Code wasn't formatting correctly, removed it
    Thread Starter cholocarlos

    (@cholocarlos)

    7 years, 10 months ago

    Thanks! The CSS worked! I should’ve been more specific then. I was just targetting the .logo-inner bit.

    Regarding the Chrome problem, I think it’s because my SVG is not actually an SVG. Rather a PNG in an SVG container. I had it re-traced into SVG and see how that goes.

    Thanks again! I’ll update this space once I try out the “real” SVG file.

    Plugin Author Benbodhi

    (@benbodhi)

    7 years, 10 months ago

    Awesome.

    Yeah, definitely make sure your elements are all vector objects and any fonts are outlined before saving your SVG and uploading to your site.

    Thanks for your support. I’m here if you run into any further issues.

    Thread Starter cholocarlos

    (@cholocarlos)

    7 years, 10 months ago

    Totally worked once I retraced the SVG! Thanks man! Awesome plugin, awesome support!

    Plugin Author Benbodhi

    (@benbodhi)

    7 years, 10 months ago

    Perfect!
    Thanks for letting me know 🙂

    I’d love if you would be so kind as to leave a review:
    https://ww.wp.xz.cn/support/plugin/svg-support/reviews/

    Cheers
    Ben

    Thread Starter cholocarlos

    (@cholocarlos)

    7 years, 10 months ago

    Done! 🙂

    Plugin Author Benbodhi

    (@benbodhi)

    7 years, 10 months ago

    Thanks so much, I really appreciate that!

Viewing 7 replies - 1 through 7 (of 7 total)

The topic ‘Resize SVG and Chrome Render Problem’ is closed to new replies.