.wrapper{
width: 100%;
max-width: 1200px;
margin: 0 auto;
}
.fixed{
position: fixed;
width: 100%;
top: 0;
left: 0;
}
.fixed-content{
width: 100%;
max-width: 1200px;
margin: 0 auto;
}
.services{
overflow: hidden;
}
.services .services_img {
position: relative;
float: left;
height: 100px;
margin-right: 50px;
}
.services .services_img:last-child{
margin-right:0;
}
.services {
position: relative;
height: 100px;
dispaly:flex;
flex-flow: row wrap;
/* следующие два свойства как раз настраивают нужное вам отображение по горизонтали и вертикали соответственно */
justify-content: space-between;
align-items: flex-start;
}
media only screen and (max-width: 1216px) {
.content{
text-align: center;
position: relative;
margin: 0 auto;
}
.content_block {
text-align: left;
position: relative;
max-width: 1200px;
width: 295px;
height: 200px;
border: solid 1px;
display: inline-block;
padding-bottom: 50px;
margin: 0 auto;
margin-top: 40px;
background-color: #FFE475;
}
//...
<button type="button" class="btn focus-btn active" data-timer-val="5">Focus</button>
<button type="button" class="btn short-break-btn" data-timer-val="25">Short Break</button>
<button type="button" class="btn long-break-btn" data-timer-val="45">Long Break</button>
let startingMinutes = document.querySelector(".btn.active").dataset.timerVal;
//...
function highlightTab(event) {
for (i = 0; i < buttons.length; i++) {
buttons[i].className = buttons[i].className.replace(' active', '');
}
event.currentTarget.className += ' active';
startingMinutes = event.currentTarget.dataset.timerVal;
}
<table>
<tr>
<td>
<table>
<tr>
<td>Ячейка 1</td>
</tr>
</table>
</td>
<td>
<table>
<tr>
<td>Ячейка 2-1-1</td>
<td>Ячейка 2-1-2</td>
</tr><!-- здесь таблицу можно закрыть и открыть новую, поскольку строка закончилась, а можно продолжить добавлять строки в эту таблицу -->
<tr>
<td>Ячейка 2-2-1</td>
<td>Ячейка 2-2-2</td>
</tr>
</table>
</td>
</tr>
</table>
let audiourl = $(this).attr('data-audio');
console.log(audiourl);
player.source = {