OUTL4W
Registered
I'm trying to use an image that is the width of xb_page_width but the overflow falls below the navbar which I'm trying to atleast hide on mobile.
in xb_header & navigation>LogoBlock PageContent> backgound field: image url then in the css box I have
@xb_page_width = 90% with boxed layout ticked.
in extra css I'm using:
which results on mobile as:
trying to eliminate the redbox area...been trying everything I can think of: fixed height, %height and if all else fails {display:none;} would be acceptable. The overflow doesn't show when in landscape just portrait mode. The "padding-bottom" trick is used by determining (Image Height / Image Width) * 100% to auto size images in responsive mode. So now I'm deferring to the experts.
in xb_header & navigation>LogoBlock PageContent> backgound field: image url then in the css box I have
Code:
min-height:250px;
min-width: @xb_page_width;
border-radius: 10px !important;
overflow: hidden;
in extra css I'm using:
Code:
<xen:if is="@enableResponsive">
@media (max-width:@maxResponsiveNarrowWidth)
{
#header .pageContent .pageWidth {padding-bottom: .17%; overflow: hidden;}
}
</xen:if>
trying to eliminate the redbox area...been trying everything I can think of: fixed height, %height and if all else fails {display:none;} would be acceptable. The overflow doesn't show when in landscape just portrait mode. The "padding-bottom" trick is used by determining (Image Height / Image Width) * 100% to auto size images in responsive mode. So now I'm deferring to the experts.