Navigation
Archive / Breadcrumbs height in mobile view
This is archived content. Visit our new forum.

Tagged: 

  • Author
    Posts
  • January 6, 2017 at 2:54 am #1318550
    c1s
    Participant

    Hi,
    my breadcrumbs don’t resize correctly in the mobile views (tablet and phone view).
    I have this code for the breadcrumbs:

    .x-breadcrumbs-wrap {
 text-align: center;
 font-size: 13px !important;
 padding: 0 0 0 0;
 background-color: rgb(237, 237, 237);
 height: 30px;
}

.x-header-landmark .x-container.max.width {
    width: 100% !important;
    max-width: none;
}

    The breadcrumbs-text should always be in the middle of the grey breadcrumbs-background, and there should alsways be 3px space between the text and the background on the top and the bottom, so that the text is vertically aligned in the middle (similar to the topbar).

    Thanks for your help!!!

    January 6, 2017 at 2:54 am #1318552
    c1s
    Participant
    This reply has been marked as private.
    January 6, 2017 at 3:47 am #1318613
    Paul R
    Moderator

    Hi,

    To fix it, you can add this under Custom > Edit Global CSS in the Customizer.

    
.x-header-landmark .x-breadcrumbs {
    padding-bottom: 8px;
    padding-top: 8px;
}

.x-header-landmark .x-breadcrumbs-wrap {
    height:auto;
    margin-top:0;
}

    Hope that helps

    January 6, 2017 at 4:04 am #1318632
    c1s
    Participant

    Hi! Great, that’s looking much better than before- thanks!!

    January 6, 2017 at 6:57 am #1318759
    Paul R
    Moderator

    You’re welcome! 🙂

  • Author
    Posts
  • <script> jQuery(function($){ $("#no-reply-1318550 .bbp-template-notice, .bbp-no-topic .bbp-template-notice").removeClass('bbp-template-notice'); }); </script>