Viewing 5 posts - 1 through 5 (of 5 total)
  • Author
    Posts
  • February 9, 2015 at 10:49 pm #393369
    eqira

    Hi,

    I have a 4 column footer and am using the responsive mode. By default, Enfold shows 1 row of 4 columns in desktop mode, 2 rows of 2 columns on tablets, and 4 rows of 1 column on smartphones. The text in each column is relatively short, so I’d prefer to show 1 row of 4 columns on tablets and 2 rows of 2 columns on smartphones.

    I searched the forums and found some CSS that looks like it should give me what I want. It does produce 2 rows of 2 columns on smartphones, however it doesn’t get me 1 row of 4 columns on tablets. Can you help me figure out what I’m doing wrong?

    Here’s the CSS:

    @media only screen and (max-width: 767px) {
    #footer .av_one_fourth, .responsive .avia-content-slider-inner .av_one_fourth {
    width: 49% !important;
    margin-left: 1% !important;}
    }
    @media only screen and (max-width: 989px) and (min-width: 768px) {
    #footer .av_one_fourth, .responsive .avia-content-slider-inner .av_one_fourth {
    width: 24% !important;
    margin-left: 1% !important;
    }}

    Thanks.

    February 10, 2015 at 11:13 am #393605
    Rikard

    Hey eqira!

    Could you please provide a link for the site in question?

    Best regards,
    Rikard

    February 10, 2015 at 4:28 pm #393754
    eqira
    This reply has been marked as private.
    February 11, 2015 at 10:59 am #394194
    Ismael

    Hey!

    This is for the tablet size:

    @media only screen and (max-width: 989px) and (min-width: 768px) {
#footer .av_one_fourth, .responsive .avia-content-slider-inner .av_one_fourth {
width: 23% !important;
margin-left: 1% !important;
clear: none;
margin-top: 0;
}}

    Looks like you managed to fix the smartphone view.

    Best regards,
    Ismael

    February 11, 2015 at 4:33 pm #394433
    eqira

    Awesome, thanks! It works perfectly. This issue is closed.

  • Author
    Posts
Viewing 5 posts - 1 through 5 (of 5 total)
  • The topic ‘Responsive 4-Column Footer’ is closed to new replies.