I have the following code:
<div class="mobileTabsNavSub brClear">
<div class="mbBtnLeftMW mbBtnLeftStyle floatLeft">
</div>
<div class="mbBtnRightMW mbBtnRightStyle floatRight">
</div>
<div class="mBtnMidMW mBtnMidStyle">
<div>
<img id="mbMW1" src="icon.png" class="mBtnIcon" />
</div>
<div>
<a href="localhost:9090" title="services"><span id="mbMW" class="mbBtnText">Services</span></a>
</div>
</div>
</div>
CSS:
.mobileTabsNav
{
display: none;
width: 100%;
overflow: hidden;
margin: 10px 0 10px 0;
}
.mobileTabsNavSub
{
width: 100%;
padding: 0 0 10px 0;
}
.mbBtnLeftMW
{
background: url('../theImages/mbMWLeft.png') no-repeat;
}
.mbBtnRightMW
{
background: url('../theImages/mbMWRight.png') no-repeat;
}
.mBtnMidMW
{
background: url('../theImages/mbMWMiddle.png');
}
.mbBtnLeftStyle
{
min-height: 50px;
max-height: 50px;
width: 10px;
background-size: contain;
}
.mbBtnRightStyle
{
min-height: 50px;
max-height: 50px;
width: 10px;
background-size: contain;
}
.mBtnMidStyle
{
overflow: hidden;
min-height: 50px;
max-height: 50px;
background-size: contain;
margin: 0 0px 0 8px;
text-align: center;
vertical-align: middle;
line-height: 40px;
}
.floatLeft
{
float: left;
}
.floatRight
{
float: right;
}
Output on most screen size:
Out on some screen size:
Three images:
Please help to get rid of the white space on some of those devices.
You can try adding comments to "link" the divs and remove any white space (not sure if it works in your case because of the float position)
<div class="mobileTabsNavSub brClear">
<div class="mbBtnLeftMW mbBtnLeftStyle floatLeft"></div><!--
--><div class="mbBtnRightMW mbBtnRightStyle floatRight"></div><!--
--><div class="mBtnMidMW mBtnMidStyle">
<div>
<img id="mbMW1" src="icon.png" class="mBtnIcon" />
</div>
<div>
<a href="localhost:9090" title="services"><span id="mbMW" class="mbBtnText">Services</span></a>
</div>
</div>
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.