Ответы пользователя по тегу HTML
  • Как сделать обрезание картинки в блоке?

    @paulinekorkina
    Верстальщик
    Есть еще вариант кроме бэкграунда, если картинка обязательно должна быть img. Правда, этот способ не работает в ИЕ11-. Родителю задаете размеры - в пикселях, процентах, в чем угодно. Внутрь помещаете img со следующими стилями:

    img {
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      -o-object-fit: cover;
      object-fit: cover;
      -o-object-position: center center;
      object-position: center center;
    }


    Но вообще я тоже предпочитаю не тег img, а свойство бэкграунд, как вам написали в предыдущем ответе, т.к. им куда удобнее управлять и он отлично работает в ИЕ.
    Ответ написан
    Комментировать
  • Сверстать кнопку в письме?

    @paulinekorkina
    Верстальщик
    Верстала письмо под разные почтовики, в Windows 10 смотрится хорошо.

    Кнопка-ссылка кроссплатформенно верстается только таблицей, насколько я знаю, правда, я делала упор на Outlook и The Bat! (последний в плане верстки - просто жесть). Паддинги многие почтовики не хавают, поэтому в качестве левого и правого мы используем пустые столбцы таблицы с заданной шириной. У меня окончательный вариант получится такой:

    <table role="presentation" cellspacing="0" cellpadding="0" border="0" align="center" style="margin: 0; background: #0382Ce; border-radius: 2px;">
      <tr>
      	<td width="19" style="width: 19px;">&nbsp;</td>
            <td style="height: 38px;">
                <a href="#" style="height: 38px; text-align: center; font-family: Arial, Tahoma, Geneva, sans-serif; font-size: 12px; line-height: 38px; text-decoration: none; padding: 0; display: block; border-radius: 4px;">
                     <font face="Arial, sans-serif" color="#ffffff" style="font-size: 12px; line-height: 38px;">
                               <span style="font-family: Arial, Tahoma, Geneva, sans-serif; color: #ffffff; font-size: 12px; line-height: 38px; font-weight: bold; letter-spacing: 0.05em; -webkit-text-size-adjust:none;">ПОДРОБНОСТИ&nbsp;НА&nbsp;ПЛОЩАДКЕ</span>
                    </font>
                 </a>
    	</td>
    	 <td width="19" style="width: 19px;">&nbsp;</td>
      </tr>
    </table>
    Ответ написан
    Комментировать
  • Какие тестовые задания дают на верстальщика?

    @paulinekorkina
    Верстальщик
    Я выполняла подобное тестовое задание - лендинг с адаптивом, дали макет psd. Написали, что время - 8 часов, но я возилась намного дольше.
    Взяли. Работаю.

    В то время нужен был любой опыт, так что я не парилась: не взяли бы - положила в портфолио и пошла дальше искать.
    Ответ написан
    1 комментарий