Jump to content

ShaxaY

Newbie
  • Posts

    6
  • Joined

  • Last visited

Information

  • Sex
    мужской

Recent Profile Visitors

The recent visitors block is disabled and is not being shown to other users.

ShaxaY's Achievements

Explorer

Explorer (1/14)

0

Reputation

  1. Отличный вариант! Спасибо! А как быть с соц сетями? Как их лучше завернуть п.с height:94%; учитывая паддинги классно зашло
  2. Доброго вечера форумчане . После просмотра уроков верстки, решил самостоятельно сверстать макет (скачать) При наведении на .about-team, мета должна выезжать вверх c прозрачным фоном и так-же появляются соц сети, уже несколько часов ломаю голову, но никак не получается сделать все нормально, взглянув на код вы сами сделаете выводы)) Уважаемые эксперты, просьба: Направьте меня на путь истинный. Как бы вы все это оформили? п.с Простите за быдло код <section class="team center-block-main"> <h2>Meet Us</h2> <div class="about-team"> <img src="image/team-1.jpg"> <p class="meta-info"><span>Jolil Shaheb</span><br>Web Developer <img class="meta-soc" src="image/soc.png"></p> </div> <div class="about-team"> <img src="image/team-1.jpg"> <p class="meta-info"><span>Jolil Shaheb</span><br>Web Developer<img class="meta-soc" src="image/soc.png"></p> </div> <div class="about-team"> <img src="image/team-1.jpg"> <p class="meta-info"><span>Jolil Shaheb</span><br>Web Developer<img class="meta-soc" src="image/soc.png"></p> </div> <div class="about-team"> <img src="image/team-1.jpg"> <p class="meta-info"><span>Jolil Shaheb</span><br>Web Developer<img class="meta-soc" src="image/soc.png"></p> </div> </section> .team{ font-family: 'Roboto', sans-serif; text-align: center; } .team h2{ font-size:1.875em; color:#454546; font-weight: 600; margin-bottom: 30px; } .about-team{ float:left; width:21%; margin-left: 4%; position: relative; font-size:0; text-align: center; } .meta-info{ position: absolute; background: rgba(114,107,101,0.9); padding: 10px 77px; bottom: 0; font-size:14px; color:#fff; font-weight: 300; } .meta-info span{ font-weight: 500; font-size: 18px; } .about-team:hover .meta-info{ background: rgba(29,222,133,0.7); top:0; bottom: 0; left: 0; right:0; padding: 50% 0 0 0; -webkit-transition-duration: .1s; -moz-transition-duration: .1s; -o-transition-duration: .1s; transition-duration: .1s; } .about-team:hover .meta-soc{ display: block; } .meta-soc{ border-top: solid 1px #fff; border-bottom: solid 1px #fff; display: none; } .about-team:first-of-type{ margin-left:0; }
  3. Думаю я просто неправильно указал значение
  4. Пробывал, не красиво выходит(
  5. Спасибо большое! Совсем забыл про outline. На данный момент просто использовал box-sizing:border-box;
  6. Верстаю макет, имеется блок с border в 1px, при наведении он должен менять цвет и становится на 1px больше т.е 2px, все сделал, но при наведении он смещает на 1px другие блоки, как можно это исправить? .welcome-box{ float:left; width:28%; margin-left: 3.3%; text-align: center; border:solid 1px #cac8c5; padding:15px 8px; } .welcome-box:hover{ border:solid 2px #1dde85; } .welcome .welcome-box:first-child{ margin-left:0; }
×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue. See more about our Guidelines and Privacy Policy