Важная информация
Показано с 1 по 6 из 6

Тема: help!

  1. #1 help! 
    Новичок
    Регистрация
    03.10.2018
    Сообщений
    3
    Сказал(а) спасибо
    0
    Поблагодарили 0 раз(а) в 0 сообщениях
    HTML Code:
    1. <section class="section">
    2.      <[Ссылки могут видеть только зарегистрированные пользователи. ] class="headline">Популярные разделы</[Ссылки могут видеть только зарегистрированные пользователи. ]>
    3.     
    4.      <[Ссылки могут видеть только зарегистрированные пользователи. ] class="grid">
    5.      <[Ссылки могут видеть только зарегистрированные пользователи. ] class="grid__item">
    6.      <[Ссылки могут видеть только зарегистрированные пользователи. ] href="#" class="grid__link">
    7.      <[Ссылки могут видеть только зарегистрированные пользователи. ] src="images/smartphones.jpg" alt="" class="grid__picture">
    8.      <[Ссылки могут видеть только зарегистрированные пользователи. ] class="grid__overlay">
    9.      <[Ссылки могут видеть только зарегистрированные пользователи. ] class="grid__text">
    10.      Смартфоны
    11.      </[Ссылки могут видеть только зарегистрированные пользователи. ]>
    12.      </[Ссылки могут видеть только зарегистрированные пользователи. ]>
    13.      </[Ссылки могут видеть только зарегистрированные пользователи. ]>
    14.      </[Ссылки могут видеть только зарегистрированные пользователи. ]>
    15.      <[Ссылки могут видеть только зарегистрированные пользователи. ] class="grid__item">
    16.      <[Ссылки могут видеть только зарегистрированные пользователи. ] href="#" class="grid__link">
    17.      <[Ссылки могут видеть только зарегистрированные пользователи. ] src="images/laptops.jpg" alt="" class="grid__picture">
    18.      <[Ссылки могут видеть только зарегистрированные пользователи. ] class="grid__overlay">
    19.      <[Ссылки могут видеть только зарегистрированные пользователи. ] class="grid__text">
    20.      Ноутбуки
    21.      </[Ссылки могут видеть только зарегистрированные пользователи. ]>
    22.      </[Ссылки могут видеть только зарегистрированные пользователи. ]>
    23.      </[Ссылки могут видеть только зарегистрированные пользователи. ]>
    24.      </[Ссылки могут видеть только зарегистрированные пользователи. ]>
    25.      <[Ссылки могут видеть только зарегистрированные пользователи. ] class="grid__item">
    26.      <[Ссылки могут видеть только зарегистрированные пользователи. ] href="#" class="grid__link">
    27.      <[Ссылки могут видеть только зарегистрированные пользователи. ] src="images/microphones.jpg" alt="" class="grid__picture">
    28.      <[Ссылки могут видеть только зарегистрированные пользователи. ] class="grid__overlay">
    29.      <[Ссылки могут видеть только зарегистрированные пользователи. ] class="grid__text">
    30.      Микрофоны
    31.      </[Ссылки могут видеть только зарегистрированные пользователи. ]>
    32.      </[Ссылки могут видеть только зарегистрированные пользователи. ]>
    33.      </[Ссылки могут видеть только зарегистрированные пользователи. ]>
    34.      </[Ссылки могут видеть только зарегистрированные пользователи. ]>
    35.      <[Ссылки могут видеть только зарегистрированные пользователи. ] class="grid__item">
    36.      <[Ссылки могут видеть только зарегистрированные пользователи. ] href="#" class="grid__link">
    37.      <[Ссылки могут видеть только зарегистрированные пользователи. ] src="images/play station 4.jpg" alt="" class="grid__picture">
    38.      <[Ссылки могут видеть только зарегистрированные пользователи. ] class="grid__overlay">
    39.      <[Ссылки могут видеть только зарегистрированные пользователи. ] class="grid__text">
    40.      Приставки
    41.      </[Ссылки могут видеть только зарегистрированные пользователи. ]>
    42.      </[Ссылки могут видеть только зарегистрированные пользователи. ]>
    43.      </[Ссылки могут видеть только зарегистрированные пользователи. ]>
    44.      </[Ссылки могут видеть только зарегистрированные пользователи. ]>
    45.      </[Ссылки могут видеть только зарегистрированные пользователи. ]>
    46.      </section>

    CSS Code:
    1. .grid__item {
    2. float: left;
    3. margin-right: 1.7%;
    4. width: 49.15%;
    5. position: relative;
    6. }
    7. .grid__item:nth-of-type(2n) {
    8. margin-right: 0;
    9. }
    10. .grid__overlay {
    11. position: absolute;
    12. top: 0;
    13. right: 0;
    14. left: 0;
    15. background: rgba(0, 0, 0, 0.5)
    16. }
    17. .grid__picture {
    18. max-width: 100%;
    19. display: block;
    20. }
    21. .grid__link {
    22. color: #fff;
    23. text-align: center;
    24. font-size: 1.8125rem;
    25. }
    26. .grid__text {
    27. position: relative;
    28. top: 50%;
    29. }


    Нужно сделать текст(смартфоны, ноутбуки и проч.) по центру соответствующих фоторафий. Please help
    Ответить с цитированием  
     

  2. #2  
    Супер модератор
    Регистрация
    18.04.2014
    Сообщений
    18
    Сказал(а) спасибо
    0
    Поблагодарили 33 раз(а) в 17 сообщениях
    Попробуйте в grid_text вместо top использовать margin-top
    Ответить с цитированием  
     

  3. Пользователь сказал cпасибо:

    >Quiet Snow< (03.10.2018)

  4. #3  
    Новичок
    Регистрация
    03.10.2018
    Сообщений
    3
    Сказал(а) спасибо
    0
    Поблагодарили 0 раз(а) в 0 сообщениях
    Цитата Сообщение от natal Посмотреть сообщение
    Попробуйте в grid_text вместо top использовать margin-top
    Не помогло, кажется я догадываюсь в чем может быть дело. В CSS коде для класса Grid__picture, у меня задано свойство display:block, все свойства у меня имеют синий цвет шрифта, а display остался белым. Почему так? Сорри за путаное объяснение, я новичок)
    Ответить с цитированием  
     

  5. #4  
    Супер модератор
    Регистрация
    18.04.2014
    Сообщений
    18
    Сказал(а) спасибо
    0
    Поблагодарили 33 раз(а) в 17 сообщениях
    У вас прописан белый цвет в grid_link, grid_picture входит в этот класс, поэтому цвет белый
    Ответить с цитированием  
     

  6. Пользователь сказал cпасибо:

    >Quiet Snow< (03.10.2018)

  7. #5  
    Новичок
    Регистрация
    03.10.2018
    Сообщений
    3
    Сказал(а) спасибо
    0
    Поблагодарили 0 раз(а) в 0 сообщениях
    Цитата Сообщение от natal Посмотреть сообщение
    У вас прописан белый цвет в grid_link, grid_picture входит в этот класс, поэтому цвет белый
    [Ссылки могут видеть только зарегистрированные пользователи. ]

    Обратите внимание на свойство display. Оно что неактивно?
    Последний раз редактировалось Денис Овчинников; 03.10.2018 в 19:22.
    Ответить с цитированием  
     

  8. #6  
    Супер модератор
    Регистрация
    18.04.2014
    Сообщений
    18
    Сказал(а) спасибо
    0
    Поблагодарили 33 раз(а) в 17 сообщениях
    Если вы про цвет текста, то display на это не влияет. У вас белый цвет текста прописан в родительском классе.
    Ответить с цитированием  
     

  9. 2 пользователя(ей) сказали cпасибо:

    >Quiet Snow< (07.10.2018), Free Admin (08.10.2018)

Информация о теме
Пользователи, просматривающие эту тему

Эту тему просматривают: 1 (пользователей: 0 , гостей: 1)

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