bottom footer is not inline

[duy87]

Hello, My bottom footer is showing an issue, it is not in showing vertically but horizontally for smaller devices (tablets and mobiles). The footer top looks ok. Please check the attached image. Thank you.

[duy87]

my website: www.kurzon.cz Please, if you screenshot my website, make sure my website name wont be seen. My website is still not launched so I want to keep i hidden. Thank you.

[Anshuman Sahu]

It seems your custom css: .col-md-4{width:25% !important}  is added which is causing this issue . Please try adding the given css :

footer .col-md-4 {

1. width: 100% !important;
2. text-align: center;

 

}

[duy87]

That code makes it look like this... Please check the attached image. I removed the custom css I added: width: 25% Thank you

[Anshuman Sahu]

I guess i have fixed the issue in the footer by adding the following css : @media(max-width:738px){footer .col-md-4 { width: 100% !important; text-align: center; } footer { text-align: center; } .footerwidget { display: inline-block; } }  

[duy87]

Nope that code made it different but the fourth widget does not fit into the row. On mobile and tablets it looks still badly. Please, make sure if you screenshot my website, there will not be showing my website URL or the name of the website... I want to keep it in secret because it is not launched yet. Thank you for understanding Credentials www.kurzon.cz/wp-admin Username: Author Password: Author4321  

[Anshuman Sahu]

Then modify the above css near the max-width setting.

@media(max-width:950px){footer .col-md-4 {

width: 100% !important;

text-align: center;

}

footer {

text-align: center;

}

.footerwidget {

display: inline-block;

}

 

}

[duy87]

I tried it.. I do not understand why it does not work on my website :(

[duy87]

I can see that single widget in footerbottom has this code: @media (min-width: 992px) .col-md-4 { width: 33.33333333333333%; If I put there: width: 25%; It will look OK but not on other devices.

[duy87]

Any help here, please?

[Anshuman Sahu]

Please explain what is not working ! Please share screenshots of what you need. We've shared fixes based on our understanding of your requirements, so it would really really great if you can share more information and details on the topic which would help us in understanding and resolving this topic faster.  

[duy87]

please take a look at the attached picture on how the bottom footer looks now on PCs and Tablets/phones. I hope its more clear to you. :) Thank you in advance. Maybe if I upload new footer file, everything will look fine again?

[Anshuman Sahu]

Please note that in footer we are using the bootstrap grids to show the widgets in columns and genrally the grid breaks when the resolution  of the screens is small . So the customization that you are asking could not be possible with the bootstrap grid as it breaks when the resolution of the screens becomes small .

[duy87]

  What if I replace the footer.php with default file? Is it going to look good again? Or it will stay messed up? Thanks...

[Anshuman Sahu]

Well it will not have any effect bcoz the two footers are the top and bottom footers and content in it is generated by the sidebars top footer sidebar and bottom footer sidebar .

[Author]

Posts