X   Сообщение сайта
(Сообщение закроется через 3 секунды)



 

Здравствуйте, гость (

| Вход | Регистрация )

Открыть тему
Тема закрыта
> последовательность :nth-child
sergei_burg
sergei_burg
Topic Starter сообщение 18.7.2019, 15:07; Ответить: sergei_burg
Сообщение #1


У меня почему то :nth-child который должен быть 1 стал вторым и причин для этого я не вижу.
то есть <div class="HeaderButton"> который первый в структуре воспринимает значение только 2

[CSS]
@charset "utf-8";
/* CSS Document */

html, body{
padding: 0;
margin: 0;
background: #fff;
color: #2e2e2e;
font-family: 'Ubuntu', sans-serif, "sans-serif";
font-size: 16px;
}
a{
color: #B23730;
text-decoration: underline;
}
main{
max-width: 1280px;
margin: 0 auto;

}
header{
height: 150px;
margin: 60px 0px 0px 0px;
display: flex;
jjustify-content: space-between;
align-items: center;
}

.HeaderLogo{
text-align: center;
flex-basis: 50%;
}
.HeaderButton{
width: 320px;
display: flex;
justify-content: center;
align-items: center;
}
.HeaderButton:nth-child(2){
margin-left: 300px;
}
.Button:nth-child(1){
margin: 0px 1rem 0px 0px;
}
.Button:nth-child(2){
width: 60px;
}
.color{
color: #B23730;
}
.deviz{
font-size: 12px;
color: #2e2e2e2;
}
[/CSS]

<main>
<header>
<div class="HeaderLogo">
<img src="images/logotip1.svg" width="80%" alt=""><br>
<p class="deviz">Девиз социального приюта <span class="color">Дари добро</span></p>
</div>
<div class="HeaderButton">
<div class="Button"><a href="#">Стать волонтером</a></div>
<div class="Button"><img src="images/iconka5.svg" alt=""></div>
</div>
<div class="HeaderButton">
<div class="Button"><a href="#">Помочь приюту</a></div>
<div class="Button"><img src="images/iconka6.svg" alt=""></div>
</div>
</header>
</main>
0
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
Degradator
Degradator
сообщение 18.7.2019, 15:57; Ответить: Degradator
Сообщение #2


Ничего не понятно, запости только то что относится к вопросу
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
icoder
icoder
сообщение 18.7.2019, 17:38; Ответить: icoder
Сообщение #3


Потому что учитываются все дочерние элементы родителя.
В данном случае у header 3 дочерних элемента
- .HeaderLogo
- .HeaderButton
- .HeaderButton
Как видите .HeaderButton здесь идет вторым и третьим.


--------------------
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
sergei_burg
sergei_burg
Topic Starter сообщение 19.7.2019, 11:05; Ответить: sergei_burg
Сообщение #4


(Proger @ 18.7.2019, 20:38) *
Потому что учитываются все дочерние элементы родителя.
В данном случае у header 3 дочерних элемента
- .HeaderLogo
- .HeaderButton
- .HeaderButton
Как видите .HeaderButton здесь идет вторым и третьим.


А почему тогда когда я ставлю значение 1 не чего не происходит, получается изменение должны коснуться .HeaderLogo но не касаются
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
icoder
icoder
сообщение 19.7.2019, 16:06; Ответить: icoder
Сообщение #5


(sergei1980 @ 19.7.2019, 14:05) *
когда я ставлю значение 1 не чего не происходит, получается изменение должны коснуться .HeaderLogo но не касаются

Потому что вы явно указываете другой класс
(sergei1980 @ 18.7.2019, 18:07) *
.HeaderButton:nth-child(...


--------------------
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
sergei_burg
sergei_burg
Topic Starter сообщение 20.7.2019, 8:56; Ответить: sergei_burg
Сообщение #6


спасибо

Замечание модератора:
Эта тема была закрыта автоматически ввиду отсутствия активности в ней на протяжении 100+ дней.
Если Вы считаете ее актуальной и хотите оставить сообщение, то воспользуйтесь кнопкой
или обратитесь к любому из модераторов.
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
Открыть тему
Тема закрыта
1 чел. читают эту тему (гостей: 1, скрытых пользователей: 0)
Пользователей: 0


 



RSS Текстовая версия Сейчас: 28.3.2024, 15:47
Дизайн