XF 1.2 Help with responsive breadcrumb issue

Andy.N

Well-known member
Here is a page that has 2 simple top and bottom navigation breadcrumbs. When you resize the windows to make it smaller, it appears the "breadcrumb" has a longer width than the pageWidth setting.

There must be something in the navigation.css or breadcrumb.css that I need to adjust. The style is Flexile and the author seems to abandon it so hope to get help from the community
.Screen Shot 2013-09-14 at 11.08.07 PM.webp
 
Code:
/* Responsive Settings */
<xen:if is="@enableResponsive">
@media (max-width:@maxResponsiveNarrowWidth)
{
        .breadBoxTop, .breadBoxBottom
        {
                margin: 0 -10px !important;
        }
}
</xen:if>

That seems to fix it, add it to EXTRA.css. Previously it was margin: 0 -20px;
 
Code:
/* Responsive Settings */
<xen:if is="@enableResponsive">
@media (max-width:@maxResponsiveNarrowWidth)
{
        .breadBoxTop, .breadBoxBottom
        {
                margin: 0 -10px !important;
        }
}
</xen:if>

That seems to fix it, add it to EXTRA.css. Previously it was margin: 0 -20px;
Steve,
Thanks again, just discovered that having that fix will help on the XF page, but not on thread view. For example, if you look at this url and resize your window, the top breadcrumb is short of 10px while the bottom breadcrumb is 10px too long or something.
https://www.quantnet.com/threads/students-intro-thread.7522/
 
Top Bottom