Archived topic
SVG Dimensions - Best Way to Add?
3 replies · Started by Brent Wilson on April 18, 2022
What is the best way to solve the issue of missing svg image dimensions?
On ericollila.com, I am using an SVG logo file on the home page hero section. It keeps getting called out when I run page tests for not having dimensions. It is using the core image block inside a GB container block.
Screenshot here: https://i.postimg.cc/Hxsn5tRp/Screenshot-2022-04-18-19-56-52.jpg
Hi Brent,
With regards to image dimensions of SVG, see David’s response here: https://generatepress.com/forums/topic/image-elements-do-not-have-explicit-width-and-height-7/#post-1962439
For Image Blocks, you can set a specific width and height as such: https://share.getcloudapp.com/xQuqNP6L
Hope this clarifies. :)
Could you reshare that link to David's response? The link you included is the link to my question thread here.
Am I seeing correctly that when adding an SVG to an image block, there is no option to set specific width and height?
Sorry about that. Fixed the link above.
With regards regards to the Image Block, there should be one: https://wordpress.com/support/wordpress-editor/blocks/image-block/#:~:text=image%20to%20100%2C%2075%2C%2050%2C%20and%2025%25%20of%20its%20original%20size.
You may also try setting its width and height it through custom CSS. For instance:
img.wp-image-29735 {
width:1000px !important;
height:500px !important;
}
Kindly replace the values to your preference. Moreover, you may also set a class for the Image Block and use it as a selector for the CSS above instead.
Please let us know how it goes. :)