Я просто работаю над проектом и не могу понять, что происходит с моими кнопками. У меня есть текстовые элементы ниже кнопок, но по некоторым причинам они продолжают перекрываться. Просто интересно, кто-нибудь знает быстрое решение? Я попытался поместить обертку вокруг двух кнопок и установить ее для отображения: блок, но это все равно не сработало Изображение и код ниже:
.hourlyButtonContainer {
font-weight: 500;
font-size: 14px;
line-height: 16px;
left: 0;
text-align: center;
position: absolute;
width: 50%;
margin-bottom: 15px;
display: block;
}
.dailyButtonContainer {
font-weight: 500;
font-size: 14px;
line-height: 16px;
right: 0;
text-align: center;
position: absolute;
width: 50%;
display: block;
}
#hourlyButton,
#dailyButton {
color: #7E8959;
width: 100%;
height: 48px;
}
.displayContainer {
display: block;
}
.displayContainer>div {
display: inline-block;
display: -moz-inline-box;
*display: inline;
/* For IE7 */
zoom: 1;
/* Trigger hasLayout */
width: 25%;
text-align: center;
font-weight: normal;
font-size: 14px;
line-height: 16px;
padding-left: 5px;
padding-right: 5px;
vertical-align: top;
}
.nextHoursContainer {
text-align: center;
margin: 20px;
}
#popTrailsNextHours {
color: #7E8959;
text-align: center;
border: 1px solid #7E8959;
padding: 10px;
border-radius: 20px;
font-size: 14px;
font-weight: 500;
line-height: 16px;
}
<div class="hourlyButtonContainer">
<button id="hourlyButton" v-on:click="hourlySelected()">HOURLY</button>
</div>
<div class="dailyButtonContainer">
<button id="dailyButton" v-on:click="dailySelected()">DAILY</button>
</div>
<div class="displayContainer">
<div>LIVE</div>
<div>1 PM</div>
<div>3 PM</div>
<div>5 PM</div>
</div>
<div class="displayContainer">
<div>SVG</div>
<div>SVG</div>
<div>SVG</div>
<div>SVG</div>
</div>
<div class="displayContainer">
<div>Not busy</div>
<div>Usually as busy as it gets</div>
<div>usually a little busy</div>.
<div>usually not too busy</div>
</div>
<div class="nextHoursContainer">
<button id="popTrailsNextHours">NEXT 48 HOURS</button>
</div>
*** «Почасовые» и «ежедневные» должны быть над другим текстом [Изображение перекрытия]
Изображение перекрытия
![enter image description here](https://i.stack.imgur.com/022k0.png)