Border on the full home page - by mariangio

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

  • Avatar: mariangio
    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!

    7 Answers
    Avatar: Rose Tyler
    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

    Avatar: mariangio
    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.

    Avatar: Olga Barlow
    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

    Avatar: mariangio
    mariangio
    Participant
    May 13, 2021 at 08:58

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

    Avatar: Olga Barlow
    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

    Avatar: mariangio
    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

    Avatar: Olga Barlow
    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

  • Viewing 8 results - 1 through 8 (of 8 total)

You must be logged in to reply to this topic.Log in/Sign up

We're using our own and third-party cookies to improve your experience and our website. Keep on browsing to accept our cookie policy.