Tagged: footer, media queries, stretch
-
AuthorPosts
-
October 11, 2014 at 1:06 am #334127
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 #334894Hey rgruber!
Please add following code to Quick CSS in Enfold theme options under General Styling tab
#socket .container { margin: 0; }
Cheers!
YigitApril 9, 2015 at 4:45 am #425695Hi 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 #425878Hi!
Could you provide us with a link to the site in question so that we can take a closer look please?
Regards,
RikardApril 11, 2015 at 1:23 am #426860Hello,
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 #427543Hi!
@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,
ElliottApril 13, 2015 at 4:08 pm #427548i 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 #427744Hello,
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 #427934Hi!
@haydaw let us stick to your topic here – https://kriesi.at/support/topic/issues-with-custom-css-not-working/Regards,
YigitApril 14, 2015 at 5:33 am #427990I’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, 8 months ago by misterwoodman.
April 14, 2015 at 12:26 pm #428162by 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%; } }
-
AuthorPosts
- The topic ‘Can you make header and footer stretch full width like a grid row?’ is closed to new replies.