html
<header>
<section class="intro">
<input type="radio" name="name" id="link1" checked>
<input type="radio" name="name" id="link2">
<input type="radio" name="name" id="link3">
<input type="radio" name="name" id="link4">
<input type="radio" name="name" id="link5">
<section class="content">
<section class="inner">
<li class="home-page background">
<section class="home section-background">
<article>
<span class="logo"></span>
<span class="about">
<h1>megapolis studio</h1>
<p>Lorem ipsum Lorem ipsum Lorem ipsum Lorem ipsum Lorem ipsum Lorem ipsum Lorem ipsum </p>
<a class="read-more">Узнать больше</a>
<a class="callback">Позвоните мне</a>
</span>
</article>
</section>
</li>
<li></li>
<li></li>
<li></li>
<li></li>
</section>
</section>
<section class="radio-buttons">
<label for="link1"></label>
<label for="link2"></label>
<label for="link3"></label>
<label for="link4"></label>
<label for="link5"></label>
</section>
</section>
</header>
css
.intro {
position: relative;
}
.inner {
width: 500%; height: 100%;
position: absolute;
top: 0; left: 0;
}
.inner li {
width: 20%; height: 100%;
float: left; display: block;
padding: 68px 0;
}
/* Content section */
/* Home page */
.background {
background-size: cover;
background-position: center;
}
.section-background {
float: right;
width: 70%; height: 100%;
background-color: rgba(17, 17, 17, .925);
}
.home-page {
background-image: url(img-1.jpg);
}
/* Controls */
/* Labels buttons */
.radio-buttons {
width: 20%;
position: absolute;
top: 68px; bottom: 68px; left: 0;
background-color: rgba(17, 17, 17, .925);
}
Проблема в контейнере с label. Отступ сверху есть, снизу не делает. У всех контейнеров оберток задана фиксированная высота и ширина 100%
Все у вас прекрасно работает. Просто у section.intro высота МЕНЬШЕ, чем нужно для размещения блока .radio-buttons (она определяется содержимым, спозиционированным не абсолютно, т.е., в данном случае кучкой радиокнопок). Поставьте section.intro высоту, например, 200px и понаблюдайте за поведением .radio-buttons.
Айфон мало держит заряд, разбираемся с проблемой вместе с AppLab
Перевод документов на английский язык: Важность и ключевые аспекты
Прошу помощи у более опытных ребятУчусь только 3 месяца, взял себе второй макет для учебы и там вот такая секция:
помогите, пожалуйста сверстать подобную таблицу средствами html и сssБуду крайне благодарен