Archived topic
Image Border on All Pics - Need To Remove From Map
7 replies · Started by Mary Pearson on November 10, 2019
I've added CSS to put a border around all images on my website. Unfortunately it is also putting borders across my map. How do I leave the borders for the whole site but not the map on the home page?
Thank you.
Hi there,
Have you figured this out?
I don't see a border on the home page map:
https://www.screencast.com/t/oK8ekxljd
No, I haven't. It is all the boxes on the map. When I remove the CSS for image borders, the boxes on the map (and map marker) disappear.
I just noticed that there are borders also on the arrows of my slider. Perhaps my CSS for image borders needs to be more specific.
What if you give the images a special class and just target your CSS to that specific class?
https://www.w3schools.com/html/html_classes.asp
Thank you Leo. I created a class of
.borders {
border: 5px solid #273d6e !important;
box-shadow: border-box; }
On the page I put
<h2 style="text-align: center;">MAPLE GROVE SYRUP</h2>
<span class="borders"><img class="alignleft size-full wp-image-104" src="my-site/wp-content/uploads/2019/11/family-2.jpg" alt="" width="546" height="417" /></span><strong>Hosts:</strong>
but it doesn't work. It puts the border in front of "Hosts".
How do I do this correctly please.
Try adding your class in the img tag along with alignleft size-full wp-image-104.
Or you can use Gutenberg image block and add it as a custom class in the sidebar options.
I would also recommend going through a free class like this:
https://www.codecademy.com/catalog/language/html-css
Perfect! Many thanks Leo!!!
No problem :)