I'm trying to put a proportional coloured stripe down the right side of the page in all responsive views.
I tried
in style.less
body, html {
height: 100%;
}
@stripeImagePath: "/demo-2013/images";
#right-stripe {
background: url("@{stripeImagePath}/assets/stripe-600x20.png") repeat scroll 0% 0% transparent;
background-size: contain;
width: 50%;
position: absolute;
right: 0px;
height: 100% ;
max-height: 100% ;
z-index: -1;
}in template manager injection panel "after <body>"
<div id="right-stripe"></div>but the stripe does not extend to the bottom of the page.
The computed height for the div is less than the <body> height by about 2/3rds.
My div is the direct child of the <body>, so I cannot see why it is not the same height as the body.
Is there some template javascript messing with this value - Joomla, Bootstrap or T3 ?
I'm just trying to reproduce in T3 what is shown here