Return to previous page

Border on the full home page - by mariangio

This topic has 8 replies, 3 voices, and was last updated 3 years, 6 months ago ago by Olga Barlow

mariangio

Participant

May 12, 2021 at 12:12

Hi
I would like the full home page to have a bit of border, left and right. I did it image per image but it doesn’t display well on cellphone.
How can I set a border on the home page on laptop only?
Thanks!

#287248 Copied Theme version: 7.4.0 WooCommerce version: Version 4.5.2

7 Answers
Rose Tyler

Support staff

May 12, 2021 at 13:33
Hello,

Add the next code in Theme Options > Theme custom CSS > Tablet:
```
.home {
    border: 2px solid red;
}
```
If this is not what you are looking for, describe the desired result in more detail.

Regards
#287274 Copied
mariangio

Participant

May 12, 2021 at 14:04

I was more thinking a space on the left and right of the page, same color as the background, instead of having a full screen display.

#287281 Copied
Olga Barlow

Support staff

May 12, 2021 at 15:01
Hello,

Do you want something like this https://gyazo.com/b7e20aaead952c1aa1ea12ad010354d0 ?
Then use
```
.home {
    border-left: 20px solid #dbeddd;
    border-right: 20px solid #dbeddd;
}
```
Regards
#287287 Copied
mariangio

Participant

May 13, 2021 at 08:58

Hi.
Thanks. Will it be only for the laptop version, no cellphone?
Thanks

#287358 Copied

Olga Barlow

Support staff

May 13, 2021 at 11:43

Hello,

It depends on the place you add that code https://prnt.sc/12vi3ee

Regards

#287386 Copied

mariangio

Participant

May 14, 2021 at 04:23

Thanks but that is cropping my pictures and not just adding some space on the size. It is also adding the border on my header and footer which I don’t want.
How can we add a margin only on the content (not footer and header) and not cropping the images.
Thanks

#287446 Copied
Olga Barlow

Support staff

May 14, 2021 at 11:48
Hello,

It’s not possible that you have border at the top and bottom if you added the second code that I sent you.
```
.home {
    border-left: 20px solid #dbeddd;
    border-right: 20px solid #dbeddd;
}
```
To avoid cropping of the images add the 20px right/left padding in the row settings where you have images. You use stretch option for your rows, so there is no way to add custom border without cropping without adding right/left paddings for the row content.

Regards
#287507 Copied
Viewing 8 results - 1 through 8 (of 8 total)