Лучшие практики CSS Dimension - Высота элементов / ширина (в пикселях или%)

Question

У меня вопрос о том, как лучше задать размеры элементов, стоит ли мне установить % или px ?

Я занимаюсь веб-приложениемв моей работе, и я устанавливаю каждую высоту / ширину в процентах.Это лучший подход?

Под лучшим я подразумеваю правильное отображение на различных мониторах размеров и разрешения и кросс-браузер.

Пример кода:

html
{
    height:100%;
}

body
{
    height:100%;
}

div.title
{
    background-color:Gray;
    padding:0;
    margin:0;
    float:left;
    width:100%;
}

form#ct101
{
    height:100%;
}

И это продолжается до самого конца.

Спасибо

Answer 1

Я знаю, что этот вопрос старый, но без ответа возник в несвязанном поиске Google ...

Я бы оставил высоту на 100%, это нормально, если форма - единственная вещь на экране ... которая действительно не зависит от вашего приложения. Ширина, с другой стороны ...

Используя @media, вы можете создавать свои формы для мобильных устройств и людей на рабочем столе.

пример:

@media screen and (max-width: 645px) {
form#ct101 {
width: 100%; 
} }
@media screen and (min-width: 646px) {
form#ct101 {
width: 600px; 
} }

Это заставило бы ваши формы заполнять экран на мобильных устройствах, чтобы у них было максимальное пространство для их просмотра, а затем сохранять их не такими большими на мониторах, чтобы ввод данных не был длинным. Теоретически, чем длиннее поля формы, тем дольше считается, что они заполнены, и они будут падать / отскакивать от формы.

Answer 2

Это действительно зависит от того, что вы пытаетесь сделать. Например, для тега контента мне обычно нравится использовать 80-95%. Если я делаю экран входа в систему, я бы использовал 30-40% или фиксированную ширину в зависимости от того, как выглядит остальная часть страницы.