Почему верстка отличается от figma?

Question

[DiziBreath]

Здравствуйте, работал в figma сделал макет, пытаюсь перенести его в верстку, через inspect вынимаю css, переношу в код, но объект выглядит больше и отступ дальше, чем на макете, если знает в чем может быть проблема, пожалуйста подскажите

Comments

[Сергей delphinpro]

Потому что верстка это не просто мышкой в фигме потыкать и скопировать то, что предлагается.
Тут думать нужно =) Иногда не меньше, чем при программировании.

[DiziBreath]

Просто думал у меня какие-то проблемы с отображением или что-то нужно добавлять. Не знал, что figma показывает иное расположение
Спасибо большое!

Answer 1

[Саша]

Не следует копировать все стили из Figma, обращайте внимание только на актуальный css.

Comments

[DiziBreath]

Спасибо, учту!

[Саша]

DiziBreath, Не за что!

Можете сбросить скриншот css который предлагает figma, выложите тут, посмотрим вместе.

[ForSureN1]

DiziBreath, А еще внимательно смотрите на каком полотне рисовали макет, и сравните его с вашим монитором(я про разрешение экрана)

[DiziBreath]

ForSureN1,
У меня ноутбук 15,2 с разрешением 1920-1080, в windows масштаб 125%, делал полотно 1700 чтобы фигма в режиме present показывала во весь экран без съездов, может с этим проблема

[ForSureN1]

DiziBreath, от сюда мы берем только
background: #FFFFFF;
border: 1px solid #000000;
border-radius: 300px;
остальные стили не нужны

Answer 2

[DiziBreath]

В общем нашел ответ на вопрос!
Моя проблема заключалась в том, что сайт масштабировался на 125%, как и весь инерфейс в windows. Если у вас такая-же проблема и вам нужно лишь для этого сайта уменьшить масштаб, то используйте в css атрибут zoom.

body {
    zoom: 80%;
}

Если не помогло вот статья там ссылка там еще варианты решения: https://ru.stackoverflow.com/questions/429448/%D0%....

Comments

[Саша]

DiziBreath вернуть масштабирование в браузере к стандартному можно с помощью одновременно нажатых клавиш ctrl 0