How can I change the size of an image in an image block to fullest width?

Hello,

I like to change the image size of an image in an image block so there's no frame around the image itself. The other side of the image block should still contain my text + button. Can someone help me and has a css?

I'm using version 7.1.

THANK YOU! Would be amazing if someone could help me here.

Hi. Can you share link to page where you insert image? We can help easier

Hi, it's https://www.rustyling.com/ 🙂 I like to have all 3 images in the 3 image blocks as big as the frame, the other side of the image block with text and button should remain the same.

Thank you!

On 4/13/2021 at 4:38 PM, deniselibelle said:

Hi, it's https://www.rustyling.com/ 🙂 I like to have all 3 images in the 3 image blocks as big as the frame, the other side of the image block with text and button should remain the same.

Thank you!

Hi. You mean remove this spacing?

Yes exactly! Thank you! 🙂

11 hours ago, deniselibelle said:

Yes exactly! Thank you! 🙂

Add to Design > Custom CSS

/* Visual images */
[data-section-id="60684b9531e2bd009b5b6591"] .content-wrapper {
    padding-left: 0 !important;
}
/* work with me image */
[data-section-id="60684683ed66ba3ee892c7dd"] .content-wrapper {
    padding-right: 0 !important;
}
/* about image */
[data-section-id="60683253c3cea02b2d4fb112"] .content-wrapper {
    padding-left: 0 !important;
}

Thank you, so the padding on the side is gone 🙂 But is it possible to also delete the frame below and above? The inspiration is this site: https://maleneknudsen.com/overview/

Thank you! 🙂

+ I recognized that in the mobile version the text is then also very close to the mobile frame, so it doesn't look good. Is there any other option?

3 hours ago, deniselibelle said:

+ I recognized that in the mobile version the text is then also very close to the mobile frame, so it doesn't look good. Is there any other option?

Remove above code & use this new code

@media screen and (min-width:768px) {
/* Visual images */
[data-section-id="60684b9531e2bd009b5b6591"] .content-wrapper {
    padding-left: 0 !important;
	padding-top: 0 !important;
	padding-bottom: 0 !important;
}
/* work with me image */
[data-section-id="60684683ed66ba3ee892c7dd"] .content-wrapper {
    padding-right: 0 !important;
	padding-top: 0 !important;
	padding-bottom: 0 !important;
}
/* about image */
[data-section-id="60683253c3cea02b2d4fb112"] .content-wrapper {
    padding-left: 0 !important;
	padding-top: 0 !important;
	padding-bottom: 0 !important;
}
}

 I don't know why but there's still a frame above and below the picture.

On 4/27/2021 at 9:38 PM, deniselibelle said:

 I don't know why but there's still a frame above and below the picture.

Hi. Can you take a screeshot?

Above it's how it looks with the code you gave me.

Below it's my inspiration website and the way I like how it looks:

So now frame above, below and between the images. 

On 5/5/2021 at 8:04 PM, deniselibelle said:

So now frame above, below and between the images. 

Hi. You want to remove these spacing?

Exactly, like in my example below: 

On 5/11/2021 at 6:36 PM, deniselibelle said:

Exactly, like in my example below: 

 

To remove that top/bottom spacing, you need to remove text first...

Do you mean the text above the picture (Natural.Contemporary.Authentic)? Because the text and button next to the picture should remain. 

21 hours ago, deniselibelle said:

Do you mean the text above the picture (Natural.Contemporary.Authentic)? Because the text and button next to the picture should remain. 

You can't remove top padding without removing red text.

Hey, I deleted the text above 🙂 The space above the pictures is gone now but there's still frame on the side and below the picture. 

On 5/21/2021 at 5:53 PM, deniselibelle said:

Hey, I deleted the text above 🙂 The space above the pictures is gone now but there's still frame on the side and below the picture. 

Don't remove any code in your current code

First, remove Spacer Block under image, next add this to Design > Custom CSS

body.homepage article section:nth-child(n+2) .content-wrapper {
    padding-left: 0 !important;
    padding-bottom: 0 !important;
}