Tagged: border
-
AuthorPosts
-
May 13, 2022 at 8:53 pm #1351709
Hello,
I am using the ‘Blog Posts’ element. The left and right of each thumbnail have a grey box around each post and I want to get rid of it. I have tried various sizes for thumbnails to see if it’s the size of each thumbnail but it’s not. Even if I add a thumbnail 300×300, it shows those borders on each thumbnail. I have set it to the orginal size in the ‘edit section’ and also tried automatic size and still get it. How do I remove those borders? With those borders, the page looks too ‘crowded’ with the template I am using. I have posted the link to the page in private as well as a screenshot.
Thank you once again,
BR,
MikeMay 15, 2022 at 12:23 am #1351824Hey Mike,
Please try this code in the General Styling ▸ Quick CSS field or in the WordPress ▸ Customize ▸ Additional CSS field:#main .main_color .avia-content-slider .slide-image { background: transparent; }
After applying the css, please clear your browser cache and check.
Best regards,
MikeMay 16, 2022 at 4:13 pm #1351966Hey Mike,
Worked! Thanks for that!
Just one more issue with a widget I added. I added a readjust according to screen size with 100% width and height and every time I add this widget I get a scrollbar without the whole thing adjusting and showing. I tried adding it to the body and then to the sidebar but get the same result. How can I remove the scrollbar and get the whole thing to show? I have attached the page URL and image of this.
Thanks again for the awesome support.
BR,
MikeMay 16, 2022 at 7:17 pm #1351984Hi,
I see that this is an iframe inside a code block, you could use this css:#main .avia_codeblock { height: 508px; }
the first issue is that you should add a custom class to the code block element so this doesn’t effect other code blocks on other pages, add it like this:
#main .custom-class .avia_codeblock { height: 508px; }
the second issue is that this height is not dynamic so if the iframe height changes often you will want to guess what the tallest height might be and use that.
With iframes you don’t have control of the inner content.
You could try a javascript solution.Best regards,
MikeMay 16, 2022 at 7:56 pm #1351986Hi Mike,
I added the first without custom class and worked but not sure if it caused issues with other block elements so I added the second you sent with a custom class and wasn’t applying.
#main .changely-widget .avia_codeblock {
height: 508px;I put a text block also to see what I can do but none seem to be working.
Also, I noticed without the custom css class when it worked, the background of the widget had grey. Can that also change to transparent?
BR,
MikeMay 17, 2022 at 2:07 am #1352008Hi,
Try this css
#main .changely-widget.avia_codeblock { height: 508px; }
You won’t be able to change the background color because it’s in an iframe, it must be changed at the source.
See the source link below, the larger background color is light gray.
You could try making the iframe the exact size of the inner white background color of the iframe:#main .changely-widget.avia_codeblock { max-width: 568px; height: 474px; margin: auto; }
Best regards,
Mike -
AuthorPosts
- You must be logged in to reply to this topic.