Leaderboard


Popular Content

Showing content with the highest reputation on 07/05/2019 in all areas

  1. 1 point
    <div class="first"></div> <div class="second"></div> html, body { height: 100%; } .first { height: 10%; background-color: #086fa1; } .second { height: 90%; background-color: #ff0000; }
This leaderboard is set to Kiev/GMT+03:00


  • Upcoming Events

    No upcoming events found
  • Blog Entries

  • Сообщения форума

    • https://jsfiddle.net/q2Lfaew5/2/ Пытаюсь добавить иконку к ссылке. Казалось бы, довольно простая задача, но есть несколько условностей, из-за которых пока ничего не получается. 1) Текст должен быть inline-элементом. Для того, чтобы к каждой строке применялась граница, и пустота в них была не кликабельной (как в первом примере). 2) Иконка всегда должна быть вертикально отцентрированная. Реально ли это сделать?
    • Здравствуйте. Почему в этом примере https://jsfiddle.net/pk2rgj3o/4/ в IE11 не срабатывает max-width для изображения? Мне нужно, чтобы фото не выходило за пределы родителя, при этом его ширина и ширина flex-item оставались автоматическими. В данный момент я нашел два решения этой проблемы: 1) width: 100% для фото и 2) flex: 1 для flex-item, но они оба не подходят.
    • Задаю контенту фиксированную высоту, но все равно он под футером. Вы не знаете, лучше оставить высоту футера auto?   <main class="project">
          
          <div class="blog-container">
              <div class="blog-header">
                  <div class="blog-cover">
                      
                  </div>
              </div>
              <div class="blog-body">
                  <div class="blog-title">
                      <h1><a href="#">Lorem ipsum dolor sit amet</a></h1>
                  </div>
                  <div class="blog-text"><p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Neque sapiente quae enim eius sit ratione doloremque, non quo, quaerat soluta sint aspernatur nostrum doloribus dolor perferendis saepe numquam molestiae rerum. Iusto explicabo molestias cumque expedita officia repellendus excepturi vitae iure.</p>
                  </div>
                  <div class="blog-tags">
                      <ul>
                          <li><a href="#">Lorem</a></li>
                          <li><a href="#">ipsum</a></li>
                          <li><a href="#">dolar</a></li>
                          <li><a href="#">consectetur</a></li>
                      </ul>
                  </div>
              </div>
              <div class="blog-footer">
                  <ul>
                      <li class="published-date">4 days ago</li>
                  </ul>
              </div>
          </div>     
      </main> <footer>
          
      <nav>
          
      <a href="index.html">HOME</a>
                      <a href="projects.html">PROJECTS</a>
                      <a href="blog.html">BLOG</a>
                      <a href="contact.html">CONTACT</a>
                      <a href="about.html">ABOUT</a>
                      <a href="services.html">SEVICES</a>
                      <a href="location.html">LOCATION</a>
                       </nav>
      <div class="logo">
          <a href="index.html"><img class="graphiclogo" src="logo.png" alt="logo"></a>
      </div>
      <div class="social">
          <a href="#"><img src="img/social/em.png" alt="em"></a>
          <a href="#"><img src="img/social/face.png" alt="em"></a>
          <a href="#"><img src="img/social/goo.png" alt="em"></a>
          <a href="#"><img src="img/social/inst.png" alt="em"></a>
          <a href="#"><img src="img/social/pint.png" alt="em"></a> </div> <p>Version 2019</p>
      </footer>
          <script src="js/script.js"></script>
      </body>                     .blog-container {
          background: #fafafa;
          border-radius: 5px;
          box-shadow: rgba(0,0,0,0.2) 0 4px 2px -2px;
          font-weight: 100;
          margin: 48px auto;
          margin-bottom: 100px;
          width: 50rem;
          height: 20px; } footer {
          width: 100%;
          height: auto;
          background: black;
          margin: 0 auto;
          text-align: center;
          padding-top: 25px;
          position:absolute; 
          bottom:0
      }
    • Здравствуйте. Мне необходимо вывести вертикальные однопиксельные линии через равные промежутки. Что-то примерное я нагуглил https://jsfiddle.net/6eq501tz/ Но проблема в том, что линия должна всегда находится в центре экрана. Если уменьшите ширину экрана в демо таким образом, чтобы помещались только две линии, то увидите, что при background-position: 50% 0; линии располагаются по краям экрана. Второе - на некотором разрешении в фф линии исчезают. Может есть другие идеи, как реализовать подобное, или пофиксить текущий вариант? Upd: получилось отцентрировать с помощью calc https://jsfiddle.net/8ztwr95e/ Проблема с исчезающими линиями в ФФ актуальна. Кстати, глянул в хроме - там линии постоянно отображаются, но меняется ширина в пределах 1-2px
    • Здравствуйте. Скорей всего footer со стилем position:absolute;