Подскажите пожалуйста, уже башка не варит, почему после установления селектора li, последний элемент списка переходит на вторую строчку и следующим делом нужно обязательно для последнего дочернего сделать отступ справа 0? Почему именно последний?
Разве не логично, что если элемент последний, то отступ справа ему не нужен? Попробуйте обнулить у другого - увидите, что получится.
Да, но почему он вообще переходит на другую строку? Ведь места на первой хватает
Отступ относится к этому элементу, поэтому переносится всё полностью: и сам элемент, и его отступ.
нет ответа на мой вопрос …
На ваш вопрос я ответила дважды.
Это Вы так думаете. Я думал цель ответов на форуме - помочь новичкам, однако на деле это не так
А давайте будем честными. С момента второго ответа прошло 4 дня. Никакого комментария о том, что вы поняли/не поняли, не последовало.
На форуме к сожалению нет функции личных сообщений. Поэтому напоминайте о себе сами: спрашивайте еще, спорьте, если не согласны, объясняйте конкретно, что и где не понятно. Если о вас “забыли”, пишите на почту. В общем, будьте активны.
1 лайк
я на 99% попала. правда дописала кое-что и исправила , что не по правилам курса. Потом посмотрела как надо сделать , у меня конечно , не так красиво)
ты гонишь))))))))))))
лови мой ужасс
body {
width: 280px;
margin: 0;
padding: 0;
}
.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:nth-child(5) {
margin-right: 0;
}
.miss .hitbox {
width: 10px;
height: 10px;
margin: 8px;
border-radius: 50%;
background: #999999;
position: relative;
}
.shooter-2 .lever{
width: 10px;
height: 10px;
margin:6px;
border-radius: 50%;
background: #999999;
}
.hitbox {
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);
}
span{
position: absolute;
top: 12px;
left: 9px;
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 span{
display: none;
}
.shooter-2 li:first-child span{
display: none;
}
.shooter-2 li:first-child .hitbox {
display: none;
}
.shooter-2 li:nth-child(5) .hitbox{
display: none;
}
.shooter-2 li:nth-child(5) span{
display: none;
}
.shooter-2 li:nth-child(4) .hitbox {
display: none;
}
.shooter-2 li:nth-child(4) span{
display: none;
}
(если честно, немножко было подсмотрено (прочитала, что есть два способа решения и пошла сама делать) ,но не основные позиции , а так: в части последних строк про чаилды - устала если честно и как бы все равно было понятно, что штучно надо исправлять)
Полностью поддерживаю! лучше и не скажешь.
не первый раз встречаю код
li:nth-child(5) { margin-right: 0; }
зачем его пихают в стили? Его изначально нету, добавил его к себе в готовую задачу и ничего не изменилось
Это код из старой версии задания. Не так давно его переделали. Теперь это правило не нужно.
1 лайк
До меня допёрло решение спустя 3 дня, не без помощи Google и форума, где выложен правильный код других учеников. Я наконец-то понял как нужно стилизовать эти кружочки, где что логически расположено, какие селекторы нужно отключить в итоге. По началу всё шло легко и просто, но последнее задание Дуэль… Конечно жуть! При изначальном выполнении этого задания я понял, что абсолютно нифига не усвоил из курса селекторов, хотя прошёл его на 2 раза. Не думал, что CSS для меня окажется таким сложным. Хотя многие мои знакомые программисты отзывались о CSS, как об очень лёгком и легко усвояемом языке. На данный момент эти курсы, что казались мне интересными и затягивающими, заставили меня задуматься в моих способностях…(((