Viewing 4 posts - 1 through 4 (of 4 total)
  • Author
    Posts
  • #1269571

    Scroll down, below Exclusive Offers, are four tall rectangles. I want the entire div to be smaller than the standard width of the other sections. To achieve the orange background I’m using padding but I should use a background color instead.

    Whats the best way to achieve these four containers?

    Here’s my CSS:

    #av_section_4 .av_one_fourth {
    	margin-left: 0;
    	left: 9%;
    	background: #d88d2a;
    	padding: 5px;
    }
    #av_section_4 .av-image-caption-overlay {
    	text-align: left;
    }
    #av_section_4 .av-image-caption-overlay-center {
    	padding: 0;
    }
    #av_section_4 .av-image-caption-overlay-position {
    	transform: rotate(-90deg);
    	position: absolute;
    	bottom: -18%;
    	right: 43%;
    }
    #1269771

    Hey jknetdesign,

    Could you please attach a mockup of what you’re trying to achieve?

    Best regards,
    Victoria

    #1270717

    I gave you the wrong link to the new page, sorry, here you go.
    https://www.bigsurcannabotanicals.com/new-home/

    How do you attach?

    Scroll down, below Exclusive Offers and I built four containers with an orange background.

    The entire orange square needs to be smaller, in width, than the full width color section.

    What is a better way to do this?

    #1271088

    Hi,

    You can upload your screenshots on imgur.com and post links here.

    I checked your website and it seems like you have already figured it out :)
    You could also edit your Color Section element and give it unique ID (“your-unique-id” in example below) and then add following code to Quick CSS in Enfold theme options > General Styling tab

    #your-unique-id .container {
        max-width: 80%;
    }

    Best regards,
    Yigit

Viewing 4 posts - 1 through 4 (of 4 total)
  • You must be logged in to reply to this topic.