Home Support Total Footer Columns not displaying properly on mobile

This topic contains 7 replies, has 2 voices, and was last updated by  Confidemus 1 week, 5 days ago.

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

    Confidemus
    Participant

    I am using three of the four footer columns.

    Two of these contain widgets to display a facebook feed and twitter feed.

    These are displayed OK in normal (laptop/desktop) mode, but it has just been pointed out to me that on a mobile or tablet the feeds are squashed into a third of the column width. This problem also affects the third column, which is mainly text.

    My site has been online 6 months or so, so I am sure I would have noticed if this had been a problem at launch.

    Has something changed in Total? And how can I fix this?

    site is http:/mickleystud.co.uk

    #3457

    Confidemus
    Participant

    Nobody else had this problem???

    #3458

    Confidemus
    Participant

    Never mind, fixed it in custom css.

    Would be nice to know if the theme author has just abandoned this site – support used to be incredibly good.

    #3596

    Confidemus
    Participant

    I though I had fixed this, but just discovered I had created a different problem.

    It is now working OK on mobiles and tablets, but now each of the three footer columns are 100% width on desktop/laptop, instead of side by side. Can you help please as my CSS skills are very limited.

    #3598

    HashThemes
    Keymaster

    Remove this CSS that you have added

    .ht-footer1{
    width: 100%;
    mobile-width: 100%;
    }
    
    .ht-footer2{
    width: 100%;
    mobile-width: 100%;
    }
    
    .ht-footer3{
    width: 100%;
    mobile-width: 100%;
    }

    and add the below CSS code

    .ht-footer {
        width: 30.33%;
    }
    #3615

    Confidemus
    Participant

    No, that doesnt work – when viewed on a mobile device the columns are compressed into 1/3 of the width of the footer but still are displayed below one another.

    #3617

    HashThemes
    Keymaster

    Add this CSS

    .ht-footer {
        width: 30.33%;
    }
    
    @media screen and (max-width:768px){
    .ht-footer {
        width: 100%;
    }
    }
    #3952

    Confidemus
    Participant

    Forgot to thank you – that worked perfectly!

Viewing 8 posts - 1 through 8 (of 8 total)

You must be logged in to reply to this topic.