+ Ответить в теме
Показано с 1 по 6 из 6

Тема: последовательность :nth-child

  1. #1
    Пользователь sergei1980 на пути к лучшему Аватар для sergei1980
    Регистрация
    23.01.2015
    Сообщений
    75
    Thanks
    6
    Thanked 0 Times in 0 Posts

    последовательность :nth-child

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


    @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;
    }



    <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>

  2. #2
    Местный Degradator скоро придёт к известности Аватар для Degradator
    Регистрация
    02.07.2012
    Сообщений
    2,056
    Thanks
    141
    Thanked 153 Times in 153 Posts
    Ничего не понятно, запости только то что относится к вопросу

  3. #3
    Новичок Proger на пути к лучшему Аватар для Proger
    Регистрация
    18.07.2019
    Сообщений
    17
    Thanks
    0
    Thanked 3 Times in 3 Posts
    Потому что учитываются все дочерние элементы родителя.
    В данном случае у header 3 дочерних элемента
    - .HeaderLogo
    - .HeaderButton
    - .HeaderButton
    Как видите .HeaderButton здесь идет вторым и третьим.

  4. #4
    Пользователь sergei1980 на пути к лучшему Аватар для sergei1980
    Регистрация
    23.01.2015
    Сообщений
    75
    Thanks
    6
    Thanked 0 Times in 0 Posts
    Цитата Сообщение от Proger Посмотреть сообщение
    Потому что учитываются все дочерние элементы родителя.
    В данном случае у header 3 дочерних элемента
    - .HeaderLogo
    - .HeaderButton
    - .HeaderButton
    Как видите .HeaderButton здесь идет вторым и третьим.
    А почему тогда когда я ставлю значение 1 не чего не происходит, получается изменение должны коснуться .HeaderLogo но не касаются

  5. #5
    Новичок Proger на пути к лучшему Аватар для Proger
    Регистрация
    18.07.2019
    Сообщений
    17
    Thanks
    0
    Thanked 3 Times in 3 Posts
    Цитата Сообщение от sergei1980 Посмотреть сообщение
    когда я ставлю значение 1 не чего не происходит, получается изменение должны коснуться .HeaderLogo но не касаются
    Потому что вы явно указываете другой класс
    Цитата Сообщение от sergei1980 Посмотреть сообщение
    .HeaderButton:nth-child(...

  6. The Following User Says Thank You to Proger For This Useful Post:

    sergei1980 (20.07.2019)

  7. #6
    Пользователь sergei1980 на пути к лучшему Аватар для sergei1980
    Регистрация
    23.01.2015
    Сообщений
    75
    Thanks
    6
    Thanked 0 Times in 0 Posts
    спасибо

+ Ответить в теме

Похожие темы

  1. Последовательность событий
    от Влад Филь в разделе Jquery
    Ответов: 2
    Последнее сообщение: 11.02.2014, 18:02
  2. Список ul, li и nth-child
    от jvuk в разделе CSS
    Ответов: 0
    Последнее сообщение: 28.01.2014, 18:47
  3. first-child
    от ЗАБор в разделе CSS
    Ответов: 1
    Последнее сообщение: 01.11.2012, 13:42
  4. Как удалить child в simpleXml ?
    от GRean в разделе Базы данных
    Ответов: 0
    Последнее сообщение: 08.08.2010, 10:59
  5. неправильная последовательность при записи
    от Крукозяка в разделе Базы данных
    Ответов: 6
    Последнее сообщение: 01.12.2009, 17:12

Социальные закладки

Социальные закладки

Ваши права

  • Вы не можете создавать новые темы
  • Вы не можете отвечать в темах
  • Вы не можете прикреплять вложения
  • Вы не можете редактировать свои сообщения