Весь курс “Селекторы” прошел легко. Но испытание мне АБСОЛЮТНО не понятно. Заполнил лишь 3 стиля, дальше вот,
как делать, что писать не знаю.
3 лайка
Почему мишень на нижнюю строку переноситься??
1 лайк
Прикрепите к посту код решения, пожалуйста.
У меня та же проблема, ничего не менял в CSS.
Кружки переносятся и из-за этого 92% решения.
Вот мой CSS
body{
width:280px;
margin:0;
padding:0;
}
.shooter-1{
padding:55px 0;
background:#FCF8E3;
border-bottom:1px dashed #ccc;
}
.shooter-2{
padding:55px 0;
background:#D9EDF7;
}
.target{
margin:0 auto;
width:200px;
height:25px;
padding:10px 15px;
list-style:none;
background:white;
border-radius:2px;
box-shadow:0 0 3px rgba(0,0,0,0.5);
overflow:hidden;
}
li{
position:relative;
float:left;
width:22px;
height:22x;
margin-right:20px;
background:#333;
border:1px solid black;
font-size:0;
border-radius:50%;
}
ul{
margin-right:0;
}
.hitbox{
width:10px;
height:10px;
background:#999;
margin:6px auto;
border-radius:50%;
}
.lever{
position:absolute;
top:-2px;
left:-2px;
width:26px;
height:26px;
background:#f5f5f5;
border-radius:50%;
box-shadow:0 0 2px rgba(0,0,0,0.5);
}
i{
position:absolute;
background:#f5f5f5;
width:5px;
height:25px;
top:12px;
left:11px;
box-shadow:
-1px 15px 2px rgba(0,0,0,0.3),
1px 15px 2px rgba(0,0,0,0.3);
}
.miss .lever{
display:none;
}
.shooter-2 ul li:nth-child(1) .lever{
display:none;
}
.shooter-2 ul li:nth-child(4) .lever{
display:none;
}
.shooter-2 ul li:nth-child(5) .lever{
display:none;
}Попробуйте сбросить отступ не у всего списка, а у последнего элемента li.
Да, спасибо. Поправил, всё заработало.
Только сейчас понял, что это значит.
У пятой мишени правый отступ не влазил, и поэтому она переносилась на другой ряд. Убрав правый отступ, всё встаёт на место
1 лайк
С этим испытанием совсем беда у меня, весь курс не 100% конечно, но более менее всё было понятно, но испытание не понимаю вообще. А вопрос собственно не по заданию, вот если не понимаю я такие вещи, дальше я совсем завязну? так обидно.
3 лайка
Скорее всего, тебе нужен ответ человека с опытом, но все же, как считаю я, такой же ученик: задание больше направлено на понимание чужого кода и верстки вслепую. И это приходит с опытом. 
2 лайка
Я тоже надеюсь, что это всё таки придет с опытом, так как запал имеется, интересно, хочется понимать от и до! 
2 лайка
Приветствую!
А как быть с последними 4-мя селекторами? В задании сказано, что надо для каждого правила подобрать селектор “Вам нужно всего лишь подобрать нужные селекторы для каждого CSS-правила.”.
Сам же себе и отвечу. Да, можно решить на 100% без этих последних 4-х селекторов, но можно и нужно решить с ними. И когда решил, так вроде решение на поверхности было. И сразу себе вопрос: “Как же ты не смог додуматься сразу?”.
Авторам задания 5+++++ очень крутое и тонкое задание. Мозг покипел - это хорошо.
2 лайка
я вес код писал и у меня все получилось ,но после проверки ничего не происходит , никакой процент не выпольнено не понимаю ?
Ваш код и картинку для наглядности, пожалуйста.
1 лайк
Тоже нужна помощь по данному вопросу. Задание выполнено на 99%, часть кода слизана с форума, имеем следующий вид:
Вопрос какой: где делись ножки (они же lever)? В коде они расписаны как надо.
.shooter-1 {
padding: 55px 0 55px 0;
border-bottom: 1px dashed #cccccc;
background: #fcf8e3;
}
.shooter-2 {
padding: 55px 0 55px 0;
background: #d9edf7;
}
.target {
width: 200px;
height: 25px;
margin: 0 auto;
padding: 10px 15px 10px 15px;
border-radius: 2px;
background: white;
box-shadow: 0 0 3px rgba(0, 0, 0, 0.5);
overflow: hidden;
list-style: none;
}
li {
position: relative;
float: left;
width: 22px;
height: 22px;
margin-right: 20px;
border: 1px solid black;
border-radius: 50%;
background: #333333;
font-size: 0;
}
li:last-child {
margin-right: 0;
}
.hitbox {
width: 10px;
height: 10px;
margin: 6px auto;
border-radius: 50%;
background: #999999;
}
.lever {
position: absolute;
top: -2px;
left: -2px;
width: 26px;
height: 26px;
border-radius: 50%;
background: #f5f5f5;
box-shadow: 0 0 2px rgba(0, 0, 0, 0.5);
}
i {
position: absolute;
top: 12px;
left: 11px;
width: 5px;
height: 25px;
background: #f5f5f5;
box-shadow:
-1px 15px 2px rgba(0, 0,0 , 0.3),
1px 15px 2px rgba(0, 0, 0, 0.3);
}
.miss .lever {
display: none;
}
.shooter-2 li:first-child .lever {
display: none;
}
.shooter-2 li:nth-child(4) .lever {
display: none;
}
.shooter-2 li:last-child .lever {
display: none;
}
И второй вопрос.
У многих (как и у меня) встречается взятый с форума кусок кода:
i {
position: absolute;
top: 12px;
left: 11px;
width: 5px;
height: 25px;
background: #f5f5f5;
box-shadow:
-1px 15px 2px rgba(0, 0,0 , 0.3),
1px 15px 2px rgba(0, 0, 0, 0.3);
}
Удаление селектора ничего не меняет, следовательно код бесполезный. Что там должно быть?
А про i это задачка на внимательность) замените i на span.
2 лайка
спасибо за подсказку!) дейтвительно, все задание сделано на внимательность:slight_smile:
Полностью согласен, может из-за усталости, может из-за невнимательности, но задание для меня вообще оказалось невыполнимым. Дано: доски и гвозди. Задание: Постройте атомный реактор.
Вопрос такой, повлияет ли это на дальнейшее обучение или до конца пытаться шерстить на всех форумах каждую строчку этого кода, чтобы хоть как то въехать? Просто вопрос времени и не хотелось бы надолго задержаться на нем.
Это не единственное подобное задание здесь. Можете пропустить, но позже обязательно вернитесь, когда изучите позиционирование, например.
1 лайк
Нет, немного не так. Даны разные отверстия и разнокалиберные саморезы, надо подобрать. Главное отличие в том, что надо подобрать, изучая заданный код. Я пыталась методом " научного тыка", много времени ушло. Изучила код, и все получилось сравнительно быстро. Не сдавайтесь, чем дальше, тем понятнее.
1 лайк