Tagged: , ,

Viewing 11 posts - 1 through 11 (of 11 total)
  • Author
    Posts
  • October 11, 2014 at 1:06 am #334127
    rgruber

    Is there a way to make the header and footer go more like 100% like when you create a grid row.

    The header and footer seem to be limited to less than 100% width while content areas like a grid row or a full screen slider or a masonry portfolio can grow and and shrink wider.

    Would like the header and footer to do the same.

    October 13, 2014 at 2:04 pm #334894
    Yigit

    Hey rgruber!

    Please add following code to Quick CSS in Enfold theme options under General Styling tab

    #socket .container {
margin: 0;
}

    Cheers!
    Yigit

    April 9, 2015 at 4:45 am #425695
    misterwoodman

    Hi there. That bit of CSS seems to make the socket full-width, but not the footer. I too am trying to get my 5 footer widget to use more of the full width of the footer area and not be restrained to the page size. Do you know how I can accomplish this? Thanks!

    April 9, 2015 at 12:56 pm #425878
    Rikard

    Hi!

    Could you provide us with a link to the site in question so that we can take a closer look please?

    Regards,
    Rikard

    April 11, 2015 at 1:23 am #426860
    haydaw

    Hello,

    I am actually looking for the same information. I would also like my Footer to be full width.

    There is a setting for the header to display full width, however there is not one for the header.

    Here is a URL: wp.fluidray.com

    Thanks

    April 13, 2015 at 4:03 pm #427543
    Elliott

    Hi!


    @haydaw    , You currently do not have a footer displayed but you do have a socket. Are you referring to that? If so then add this to your custom CSS.

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

    Best regards,
    Elliott

    April 13, 2015 at 4:08 pm #427548
    Guenni007

    i thought the socket was no problem he is looking for the footer:

    #footer .container {
    max-width: 100% !important;
}
    April 13, 2015 at 7:10 pm #427744
    haydaw

    Hello,

    Thanks for the feedback, however unfortunately none of the code listed above seems to be working.

    Here is an image of what needs to be accomplished; Header is 100% width, footer needs to align with the header (~96%)

    I’ve attempted the following codes, with no avail:

    
#socket .container {
margin: 0;
}

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

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

#socket .container {
margin: 0;
max-width: 100% !important;
}

    Thanks!

    April 14, 2015 at 12:11 am #427934
    Yigit

    Hi!


    @haydaw     let us stick to your topic here – https://kriesi.at/support/topic/issues-with-custom-css-not-working/

    Regards,
    Yigit

    April 14, 2015 at 5:33 am #427990
    misterwoodman

    I’m trying to get the foot widgets to display full width. Currently there is a lot of space on either side of the 5 columns in the footer: http://chaseflooring.woodywoodshop.com/

    UPDATE: Actually, looks like the CSS from @Guenni007 works. I thought I had tried that exact code before with no success. Problem solved. Thanks, guys.

    • This reply was modified 9 years, 3 months ago by misterwoodman.
    April 14, 2015 at 12:26 pm #428162
    Guenni007

    by the way : for small screenwidth it might be nice to get rid of the fifth ! (the tag for that might be media queries)

    For example: under 580px a one column look

    @media only screen and (max-width: 580px){
.flex_column.av_one_fifth {
    float: none;
    width: 95%;
    margin: 0;
}
}

    or you only change to a two column look:

    @media only screen and (max-width: 580px){
.flex_column.av_one_fifth {
div .av_one_fifth {
    margin-left: 6%;
    width: 44%;
}
}
  • Author
    Posts
Viewing 11 posts - 1 through 11 (of 11 total)
  • The topic ‘Can you make header and footer stretch full width like a grid row?’ is closed to new replies.