Hi
I try to change the size of my svg images in the "Image Addon" in custom css, but it doesn't works. Which CSS code do i need to implement, that i can define the size in % and that the image is center in high and width? Here is the page: https://www.uaveditor.com/de/unterstuetzer
I try this in my template custom css:
/*SVG Image*/
.sppb-carousel-inner>.sppb-item>a>img, .sppb-carousel-inner>.sppb-item>img, .sppb-img-responsive {
display: block;
width: 100%\9;
max-width: 50%;
height: auto;
}
Archived Forums
Accepted Answer
Hi,
your class names were not from a Image addon, please use Code Inspector from your browser next time, if you're not sure.
Use this
your class names were not from a Image addon, please use Code Inspector from your browser next time, if you're not sure.
Use this
.sppb-addon-single-image img { }
- more than a month ago
- SP Page Builder 3.x
- # Permalink
BTW
Image size also depends on column width, it cannot be wider.
My suggestion is... use value 80% for img style for this PAGE only.
but for github logo use extra class to reduce height, this logo is HUGE.
Yes, in each addon you can add a custom class name, and it should help.
Of course, if you know the basics of CSS.
In general, try to keep this same height for all logos!
Image size also depends on column width, it cannot be wider.
My suggestion is... use value 80% for img style for this PAGE only.
but for github logo use extra class to reduce height, this logo is HUGE.
Yes, in each addon you can add a custom class name, and it should help.
Of course, if you know the basics of CSS.
In general, try to keep this same height for all logos!
- more than a month ago
- SP Page Builder 3.x
- # 1
Hi Paul
Thanks a lot, i tried this:
/*SVG Image*/
.sppb-addon-single-image img {
display: block;
width: 50%\9;
max-width: 50%;
height: auto;
}
But it doesn't works?
Thanks a lot, i tried this:
/*SVG Image*/
.sppb-addon-single-image img {
display: block;
width: 50%\9;
max-width: 50%;
height: auto;
}
But it doesn't works?
- more than a month ago
- SP Page Builder 3.x
- # 2
Remove trash code first, it stops browser
Attachments (1)
- more than a month ago
- SP Page Builder 3.x
- # 3
Thanks, works now. But the images are still not centered in image container, can i set this in the image addon? (didn't found it)
- more than a month ago
- SP Page Builder 3.x
- # 4
I told you before, to have all logos with a similar look, you have to set them static height value.
Check how it was made on other websites.
Sorry, but I cannot teach you CSS here.
Check how it was made on other websites.
Sorry, but I cannot teach you CSS here.
- more than a month ago
- SP Page Builder 3.x
- # 5
Extra Security Tip
Since 3.9.21 Joomla is shipped with an additional security rule in the default htaccess.txt. This rule will protect users of svg files from potential Cross-Site-Scripting (XSS) vulnerabilities.
The security team recommends to manually apply the necessary changes to any existing .htaccess file:
Since 3.9.21 Joomla is shipped with an additional security rule in the default htaccess.txt. This rule will protect users of svg files from potential Cross-Site-Scripting (XSS) vulnerabilities.
The security team recommends to manually apply the necessary changes to any existing .htaccess file:
<FilesMatch "\.svg$">
<IfModule mod_headers.c>
Header always set Content-Security-Policy "script-src 'none'"
</IfModule>
</FilesMatch>
- more than a month ago
- SP Page Builder 3.x
- # 6
There are no replies made for this post yet.
Be one of the first to reply to this post!
Be one of the first to reply to this post!