Alter space above and below a specific layout item

That worked like a charm, thanks.

I’ll need to do this in other places as well, how do you determine the string of characters in this line?
#top .flex_column.av-lxxntb3b-96793073ee8d9b43abc1bef7251d9ab3

Not sure where to look

I’m having trouble duplicating the process for other items, the code on inspect is very long and complex but upon finding the same string of characters in the same approx spot in the code yields no results. Can you show me how to target some other items, for instance on the mobile version of the home page the layer slider that makes the three large buttons come into the page has too much space above and below it, see url to example below:

https://anthonyi28.sg-host.com/wp-content/uploads/2024/07/temp.jpg

does this part change depending on the item? #top .flex_column.

I tied it also on the desktop version with a single image graphic like the one you provided the code for but had no. luck there either.

Thanks so much for your excellent help as always

If there is another way to target individual items let me know that as well.

Having more trouble with this than I expected. Perhaps the way to go about this is with some css in the advanced > developer settings > custom css. Here I would just need css that calls back to that column. So If I wanted to lessen the space above and below the layer slider on the home page for the mobile version, see attached url below for visual, forgive me but could you give me an example of how to pull this off so I can do it elsewhere throughout the site with this method? I wrote some css for margin and padding and entire the css class into that custom css field, but it seemed to have no effect.

https://anthonyi28.sg-host.com/wp-content/uploads/2024/07/temp-example-scaled.jpg

Thanks so much

Thanks that did work nicely!. Oddly that extra space appeared on one phone we looked at and not another after all, but in both cases it looks fine now. So, great.

I have a more general question though in terms of applying css with the advance developer options :

I have this in that Custom CSS field under developer settings: remove-space

and this css in general styling to move the div up:

@media only screen and (max-width: 767px) {
.remove-space{
margin-top: -40px !important;
}
}

which is working nicely on another place where the spacing needed a tweak. My only question is is there any issue when targeting only the mobile version in using a negative number for the top margin? If this is kosher which I think it is I can stop asking for help targeting things as we have been one at a time when I can’t figure out the right place win the code to target when the inspecting the element.

Again thank you for your excellent support and patience as always.

Tony

Mike,

Awesome! You guys are so helpful it’s amazing the tech support. whyI use no other theme anymore.

Thanks