При создании новой точки остановки макет предыдущей т.о. разъезжается (вопрос решен)

[Екатерина Косилова 2]

Здравствуйте форумчане!

Пишу для тех, кто столкнется с подобной проблемой.

Сделала две точки остановки - 1920 и 1366px. Сделала для них дизайн, все корректно. Но при попытке создать еще одну точку остановки для 640px дизайн точки 1366px уехал. Дизайн 1920 остался на месте.

Выглядело это так:

1366 Здесь ссылка, но видят ее только участники клуба. Вступите в клуб по этой ссылке.

1920 Здесь ссылка, но видят ее только участники клуба. Вступите в клуб по этой ссылке.

640 (который пока не переделывала) Здесь ссылка, но видят ее только участники клуба. Вступите в клуб по этой ссылке.

До появления точки 640, точка 1366 выглядела адекватно.

Вопрос решился тем, что просто на предыдущей ТО (1366) я закрепила все элементы по центру. До этого закрепления то ли не было, то ли было разное везде.

Надеюсь кому-то поможет эта тема.

[Павел Хомерики 3360]

Не думаю, что это решение, так как выравнивание (на странице) по центру, работает только в гибких точках остановки, если вы использовали выравнивание в браузере, то это подавно не решение, так как оно намертво закрепляет элементы как по горизонтали, так и по вертикали.
При работе без ошибок такого смещения вообще не бывает. Мне кажется, что вы нашли случайный выход из глубоко ошибочной изначально ситуации. Само решение похоже на глюк

[Екатерина Косилова 2]

Павел, мне помогло, сайт после выгрузки отображается в основных разрешениях корректно

Ну вроде))

У меня несколько точек остановки, везде постоянная ширина Здесь ссылка, но видят ее только участники клуба. Вступите в клуб по этой ссылке.

Буду работать дальше - решения будут лучше

Но я как всегда благодарна любой обоснованной критике, вот сайт tea.kosilova.ru

7 часов назад, Павел Хомерики сказал:

Не думаю, что это решение, так как выравнивание (на странице) по центру, работает только в гибких точках остановки, если вы использовали выравнивание в браузере, то это подавно не решение, так как оно намертво закрепляет элементы как по горизонтали, так и по вертикали.
При работе без ошибок такого смещения вообще не бывает. Мне кажется, что вы нашли случайный выход из глубоко ошибочной изначально ситуации. Само решение похоже на глюк

[Екатерина Косилова 2]

Насчет выравнивания - использовала выравнивание в браузере по центру и закрепление на странице по центру. Прилагаю скрин. Чем это плохо, если не хорошо?)

На скрине элементы заходят за точки остановки, это я поправила уже)

Здесь ссылка, но видят ее только участники клуба. Вступите в клуб по этой ссылке.

[Екатерина Косилова 2]

В данном случае я все элементы делала специально статичными, чтобы не уехали между точками т.о. никуда. А то бывает.

7 часов назад, Павел Хомерики сказал:

... если вы использовали выравнивание в браузере, то это подавно не решение, так как оно намертво закрепляет элементы как по горизонтали, так и по вертикали.
При работе без ошибок такого смещения вообще не бывает. Мне кажется, что вы нашли случайный выход из глубоко ошибочной изначально ситуации. Само решение похоже на глюк

[Павел Хомерики 3360]

1 час назад, Екатерина Косилова сказал:

Но я как всегда благодарна любой обоснованной критике, вот сайт tea.kosilova.ru

Немного Вы не верно рассчитали. На мониторе 1440 будет так

Здесь ссылка, но видят ее только участники клуба. Вступите в клуб по этой ссылке.

На экранах 1024 будет так

Здесь ссылка, но видят ее только участники клуба. Вступите в клуб по этой ссылке.

Ну и еще на куче промежуточных размеров, тоже будет так. Не вижу ни малейшего смысла в точке 1920. 1200  -хватило бы с головой. Ну и даже если оставить имеющиеся у вас пропорции, то самое широкое место 1578.

Здесь ссылка, но видят ее только участники клуба. Вступите в клуб по этой ссылке.

1-е вообще-то стоит по умолчанию в Музе, если у вас было не так, то значит именно это и помогло. 2-е не работает в фиксированных точках остановки, то есть просто бессмысленно.

Здесь ссылка, но видят ее только участники клуба. Вступите в клуб по этой ссылке.

[Екатерина Косилова 2]

Спасибо, поправлю эти точки.

Насчет того, чтобы сделать 1200px самой широкой точкой - а на экранах 1900px края не будут смотреться слишком пустыми? Там же очень много места остается. Для примера Здесь ссылка, но видят ее только участники клуба. Вступите в клуб по этой ссылке.

8 часов назад, Павел Хомерики сказал:

Немного Вы не верно рассчитали. На мониторе 1440 будет так

Здесь ссылка, но видят ее только участники клуба. Вступите в клуб по этой ссылке.

На экранах 1024 будет так

Здесь ссылка, но видят ее только участники клуба. Вступите в клуб по этой ссылке.

Ну и еще на куче промежуточных размеров, тоже будет так. Не вижу ни малейшего смысла в точке 1920. 1200  -хватило бы с головой. Ну и даже если оставить имеющиеся у вас пропорции, то самое широкое место 1578.

Здесь ссылка, но видят ее только участники клуба. Вступите в клуб по этой ссылке.

1-е вообще-то стоит по умолчанию в Музе, если у вас было не так, то значит именно это и помогло. 2-е не работает в фиксированных точках остановки, то есть просто бессмысленно.

Здесь ссылка, но видят ее только участники клуба. Вступите в клуб по этой ссылке.

[Екатерина Косилова 2]

Павел, еще такой вопрос - если мы говорим все-таки о фиксированных точках остановки, под какие разрешения вы рекомендовали бы верстать? Насчет 1200px я вашу позицию поняла.

Я бы предположила, что 1200, 1024, 800, 640, 320px. А как вы думаете?

9 часов назад, Павел Хомерики сказал:

Немного Вы не верно рассчитали. На мониторе 1440 будет так

Здесь ссылка, но видят ее только участники клуба. Вступите в клуб по этой ссылке.

На экранах 1024 будет так

Здесь ссылка, но видят ее только участники клуба. Вступите в клуб по этой ссылке.

Ну и еще на куче промежуточных размеров, тоже будет так. Не вижу ни малейшего смысла в точке 1920. 1200  -хватило бы с головой. Ну и даже если оставить имеющиеся у вас пропорции, то самое широкое место 1578.

Здесь ссылка, но видят ее только участники клуба. Вступите в клуб по этой ссылке.

1-е вообще-то стоит по умолчанию в Музе, если у вас было не так, то значит именно это и помогло. 2-е не работает в фиксированных точках остановки, то есть просто бессмысленно.

Здесь ссылка, но видят ее только участники клуба. Вступите в клуб по этой ссылке.

[Екатерина Косилова 2]

Нашла, нашла!!

Вот вы писали Здесь ссылка, но видят ее только участники клуба. Вступите в клуб по этой ссылке.

Чудесный пост, спасибо! Очень подробно и понятно

Остались вопросы, напишите, пожалуйста:

1. То есть делаем 1200 (фикс), 960 (фикс), 768 (фикс), 768 (гибкая). И всё, да?)

2. Я когда сайт про чай делала, мне пришлось отдельно делать для мобильной версии (хотя у меня была т.о. 320px) т.к. на телефоне у меня отображалась версия десктопа. Если сделать как вы сказали такого не будет, да?

3. Почему сейчас в моем макете мониторы с разрешением 1440px берут за основу дизайн 1920, если ближайшая "нижняя" точка остановки 1366? Как и с 1024px - почему на таких мониторах не отображается точка 640px?

Мои точки остановки:

Здесь ссылка, но видят ее только участники клуба. Вступите в клуб по этой ссылке.

4.

Цитата

Теперь самое непонятное, что вызывает путаницу. Добавляете еще одну точку остановки 768, но теперь гибкую.

Как это сделать, если там уже есть фиксированная точка? Технически непонятно, как ее добавить)

12 часа назад, Павел Хомерики сказал:

Немного Вы не верно рассчитали. На мониторе 1440 будет так

Здесь ссылка, но видят ее только участники клуба. Вступите в клуб по этой ссылке.

На экранах 1024 будет так

Здесь ссылка, но видят ее только участники клуба. Вступите в клуб по этой ссылке.

Ну и еще на куче промежуточных размеров, тоже будет так. Не вижу ни малейшего смысла в точке 1920. 1200  -хватило бы с головой. Ну и даже если оставить имеющиеся у вас пропорции, то самое широкое место 1578.

Здесь ссылка, но видят ее только участники клуба. Вступите в клуб по этой ссылке.

1-е вообще-то стоит по умолчанию в Музе, если у вас было не так, то значит именно это и помогло. 2-е не работает в фиксированных точках остановки, то есть просто бессмысленно.

Здесь ссылка, но видят ее только участники клуба. Вступите в клуб по этой ссылке.

[Павел Хомерики 3360]

1 час назад, Екатерина Косилова сказал:

1. То есть делаем 1200 (фикс), 960 (фикс), 768 (фикс), 768 (гибкая). И всё, да?)

Да

1 час назад, Екатерина Косилова сказал:

2. Я когда сайт про чай делала, мне пришлось отдельно делать для мобильной версии (хотя у меня была т.о. 320px) т.к. на телефоне у меня отображалась версия десктопа. Если сделать как вы сказали такого не будет, да?

Да

1 час назад, Екатерина Косилова сказал:

3. Почему сейчас в моем макете мониторы с разрешением 1440px берут за основу дизайн 1920, если ближайшая "нижняя" точка остановки 1366? Как и с 1024px - почему на таких мониторах не отображается точка 640px?

Масштабирование работает в мобильных браузерах. В компьютерных браузерах работает только сама точка остановки. Компьютерные браузеры не принимают никакие ближайшие точки остановки, а показывает ту которая действует при данном размере экрана.

[Павел Хомерики 3360]

1 час назад, Екатерина Косилова сказал:

Как это сделать, если там уже есть фиксированная точка? Технически непонятно, как ее добавить)

Просто добавляете и всё.

Здесь ссылка, но видят ее только участники клуба. Вступите в клуб по этой ссылке.

[Екатерина Косилова 2]

Я тогда что-то не так поняла

Вот вы писали: Здесь ссылка, но видят ее только участники клуба. Вступите в клуб по этой ссылке.

Просто как определить, какая точка остановки "сработает". Ну например, у нас точки 1600px и 1400px. А монитор у клиента 1500px. Его куда притянет?))

15 минут назад, Павел Хомерики сказал:

1 час назад, Екатерина Косилова сказал:

Почему сейчас в моем макете мониторы с разрешением 1440px берут за основу дизайн 1920, если ближайшая "нижняя" точка остановки 1366? Как и с 1024px - почему на таких мониторах не отображается точка 640px?

Масштабирование работает в мобильных браузерах. В компьютерных браузерах работает только сама точка остановки. Компьютерные браузеры не принимают никакие ближайшие точки остановки, а показывает ту которая действует при данном размере экрана.

[Павел Хомерики 3360]

8 минут назад, Екатерина Косилова сказал:

клиента 1500px. Его куда притянет?))

Просто возьмите и начинайте сужать браузер мышкой, что бы понять как это работает. Пока размер экрана не достигнет 1400, будет работать 1600

[Екатерина Косилова 2]

А я раньше ползунком добавляла)) Спасибо

Получилось добавить, всё ок.

31 минуту назад, Павел Хомерики сказал:

Просто добавляете и всё.

Здесь ссылка, но видят ее только участники клуба. Вступите в клуб по этой ссылке.

[Екатерина Косилова 2]

Т.е. если у меня две точки остановки 1920px и 1366px, все мониторы от 1366 до 1920 будут показывать дизайн точки 1920.

Фух) Разобралась, спасибо

32 минуты назад, Екатерина Косилова сказал:

Почему сейчас в моем макете мониторы с разрешением 1440px берут за основу дизайн 1920, если ближайшая "нижняя" точка остановки 1366? Как и с 1024px - почему на таких мониторах не отображается точка 640px?

[Павел Хомерики 3360]

57 минут назад, Екатерина Косилова сказал:

Т.е. если у меня две точки остановки 1920px и 1366px, все мониторы от 1366 до 1920 будут показывать дизайн точки 1920.

Да