Docs

[barnettbailbonds]

How can I make the top bar collapse like the menu bar does when it reaches a certain dimension. Everything looks fine when the screen is maximized, but when i change it to the tablet/mobile site or decrease screen dimension from maximum to a certain point, all of the formatting gets really messed up.
My logo in the upper left hand corner starts to overlap lines and the buttons on the top right hand corner become jumbled up together. If what im asking isnt possible as a fix to make everything formatted and more appealing, then any fix to make everything work properly for all dimensions and sizes will work as a solution as well.
Thank you in advanced for all of your help!

[barnettbailbonds]

This reply has been marked as private.

[Rupok]

Hi there,

Thanks for writing in! Topbar not supposed to collapse for mobile You can add this under Custom > CSS in the Customizer.

@media only screen and (max-width: 767px) {
.x-topbar {
  position: relative;
}
.x-topbar .x-btn {
  display: block;
  float: none;
  margin: 10px auto !important;
  max-width: 200px;
  width: 100%;
}
}

Hope this will make it better.

Cheers!

[barnettbailbonds]

Thank you!! It worked! Can you help me make the information above my buttons collapse a well?

1. phone number
2. icon + text
3. 3 buttons

Thank you!

[Nico]

Hi There,

Regretfully, this particular customization request is outside the scope of our support as this is not related to an issue with the theme and instead has to do with your customization of it. As such, you will need to investigate this particular issue on your own or seek help from a developer should you not feel comfortable making these changes yourself. If you have any further questions about the theme, we are more than happy to provide you with assistance on these inquiries.

Thank you for your understanding.

[Author]

Posts