Tagged: 

Viewing 6 posts - 1 through 6 (of 6 total)
  • Author
    Posts
  • #992805

    Hi there,

    I saw a thread where a similar this question was asked but the answer wasn’t included in the thread unfortunately. I would like to create a full width line above the footer and in other places throughout the site. At the moment the only way I can achieve this is by creating a color section and keeping padding to a minimal, however this is too thick for me. I’m looking for a line 5px high and full width. There doesn’t appear to be any options in the fullwidth separator to add colour or thickness.

    Many Thanks
    Valinsy

    #993568

    Hey Valinsy,
    We can do this by adding a colored border to your sections, the css in your Enfold Theme Options > General Styling > Quick CSS field would look like this:

    
    #top.home #av_section_3,#top.home #av_section_4 {
        border-top-color: #efbb20 !important; 
        border-top-width:5px !important; 
        border-top-style:solid !important; 
    }

    This adds a border to your footer & the section above it. If you enable the: Enfold Theme Options > Layout Builder > Show element options for developers and add a custom ID to the sections you want a top-border on, and replace “#top.home #av_section_4” with your custom ID, which starts with the # symbol (ie: #above_footer) you will be able to manage them yourself.
    You can add multiple ID’s separated by a comma.

    Best regards,
    Mike

    #993995

    Thanks Mike,
    This worked great however there is now also a grey border line that appeared underneath the section and I’ve no idea how to remove it.

    I gave the text section the ID product_info and then used this code

    #top.home #av_section_3,#product_info {
        border-top-color: #efbb20 !important; 
        border-top-width:3px !important; 
        border-top-style:solid !important; 
    }

    Do I need to add something to remove the bottom border?
    Thanks
    Valinsy

    #994199

    Hi,
    Please change your code to:

    #top.home #product_info {
        border-top-color: #efbb20 !important; 
        border-top-width:3px !important; 
        border-top-style:solid !important; 
    }

    if this doesn’t resolve it, please add this code:

    #top.home #after_submenu_1 {
        border-top-color: transparent !important; 
    }

    Best regards,
    Mike

    #1000002

    Hi

    This was close to my question, but slightly different. I want to set a specific amount of section padding as large to to small and huge is too much.For

    a) all sections everywhere in the site or specific pages only
    b) specific sections whether on a page or several pages

    I also set 1 px separator for a section that I want to keep.

    Can you please help?

    I do not want to set IDs on all sections now, so rather do this with CSS if possible.

    I found this post which seems similar to my problem
    https://kriesi.at/support/topic/a-color-section-has-more-width-than-other-sections/
    but not sure how to properly do this for the scenarios above. Example links below.

    Thanks

    #1000097

    Hi,
    To add padding to each of your sections on your “software” page, Please try this code in the General Styling > Quick CSS field:

    #top.page-id-7712 .avia-section-large {
    padding: 50px 0;
    }

    adjust the padding to suit.
    If you want this on every page, try removing the page ID (page-id-7712).

    Best regards,
    Mike

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