Pictures full width of screen on every viewing device

[mickeyschlick]

Hello-

I have my rows split into thirds and I want those pictures to be shown full screen without any space in between them. I have managed to get it to look like it was okay in the page builder but when I view it on a separate tab, it is still showing spaces in between each picture (width-wise). I have the padding and margin set to 0, can you give me some direction? http://montanatattoocompany.com/Meet-the-Company-mtc/

I also want to do the same thing with the buttons but I cannot figure out to do that, especially with the buttons on the desktop home screen since I used CSS to make that shape. This is the main page I am working on, but I do want pictures/buttons to be full screen on all devices for all pages.

HOME PAGE

Your help is much appreciated. Thank you!

[tristup]

Hi @mickeyschlick,

Thanks for reaching out.
I have checked your page and found that you haven’t set the width. I would suggest you set the width to 100% to get the full-width image.

[SCREENSHOT]

Regarding the Home Page button, we are not sure what exactly you are trying to point out here. Can you please provide any screenshot marked with it which helps us to recognize what you are trying to achieve?

Thanks

[mickeyschlick]

I see, I was setting the width in the wrong part. That helped with that problem, thanks.

I figured out my issue with the home page for the most part, however the bottom half of these buttons (see picture) appeared cut off when I view the webpage outside of the page builder. I will also include the CSS I have for those buttons. I figured the issue was with the margins somewhere but I haven’t been able to pin point it.

.homebuttonl{clip-path: polygon(0 25%, 100% 60%, 100% 100%, 0% 100%);margin: 3px 0px;}

[mickeyschlick]

I messed with the padding and margins some more and thought I was able to achieve what I wanted although, I am not sure if I went about that correctly at all because it does not look uniform on different devices at all. I am assuming there is some CSS to solve this issue or is there a way to do this without CSS? Thanks.

[ruenel]

Hello @mickeyschlick,

You are on the right track. Just adjust your margins on different screens sizes by utilizing the Responsive Element Styling. Perhaps this documentation can help.

• Responsive Styling | Themeco Docs

Best Regards.