Viewing 8 posts - 1 through 8 (of 8 total)
  • Author
    Posts
  • #410867

    Hi,

    I think I know the answer but figured it was worth a try as sometimes the brilliant support team here has a solution that never occured to me.

    What I want – my Home page to have a full screen background image but have a colored section in the content area that streaches full width.

    I am currently using a Colored section to contain the full screen background image. Doing this means I can’t have a colored section to contain the full-width colored background strip (which will then hold normal content).

    Any ideas?
    Thanks,
    Slade

    #411006

    Hey Slade!

    Not sure if i understood you clearly but i guess you would like to make the content of your color section fullwidth? If so, please give your Color Section an unique ID – http://kriesi.at/documentation/enfold/wp-content/uploads/sites/2/2013/12/color-section-ID.png
    then add following code to Quick CSS

    #your-custom-id .container { max-width: 100%; padding: 0; margin: 0; }

    Regards,
    Yigit

    #411285

    Hi Yigit!

    But what if I am already using a Colored Section to hold the Fullscreen background image? I don’t believe I can place a Colored Section inside of a Colored Section..??

    You can see where I am going here: http://beachfrontgardeninn.com/bf_newsite/ (please excuse the messiness of the site as I just started layout) :)

    I am currently using a Text Box inside the Colored Section. The Text Box has a Custom CSS Class so I could give it a background color. I would love it if that background could run Full Width. The client really liked the design/layout of this site: http://www.montereyrentals.com/ As you can see they have a fullscreen background image with their version of Colored Sections running the Full Width on top of the Background.

    If this isn’t possible…no worries. I think I can style this one up enough to sell him on it but wanted to make sure it wasn’t possible first.

    Thanks!
    Slade

    #411815

    Hey!

    try out this code in Quick CSS:

    .home-search-form {
    width: 116%;
    margin-left: -85px;
    }
    

    and adjust if necessary.

    Regards,
    Andy

    #411899

    Hi Andy!

    Thanks for the reply. This did make it a little wider but not by much and definitely not full-width.

    Much appreciated though.

    Slade

    #412494

    Hey!

    Try adding this to your custom CSS.

    #home-bg .container { max-width: 100% !important; }
    

    Cheers!
    Elliott

    #625098

    hmm I’m having the same issue! I want the container with the text to be full-width and I tried your code in quick css to see if it would do the trick and it didn’t. Any help would be greatly appreciated – see link below!

    #625107

    Hi,

    Please do create a new ticket, so we can manage help as good as possible.

    Best regards,
    Basilis

Viewing 8 posts - 1 through 8 (of 8 total)
  • The topic ‘Fullscreen BG image "with" full-width color section’ is closed to new replies.