Возможно, это не лучший способ спросить, о чем я спрашиваю, но я не знаю, как еще это сказать.У меня есть воссозданная версия веб-сайта sega.com 1996 года. Я пытался переделать макет без использования таблиц, как раньше, и думаю, что это выглядит нормально.
Но проблема в том, что теперь, если я сожму окно браузера до ширины менее 550 пикселей. содержимое страницы просто выходит за пределы окна, что не идеально.
Поскольку макет и расположение всего на странице важны, я хотел бы сделать так, чтобы, когда ширина устройства меньше ширины страницы (550 пикселей), вся страница и ее содержимое масштабировались, чтобы соответствовать этой ширине, без изменения положения или относительных размеров контента.
Вот как выглядит сайт:
/>воссоздание веб-сайта sega.com
вот что он делает, когда его размер становится меньше его ширины:
веб-сайт sega.com выходит за границы браузера
вот примерное то, что я хочу, чтобы веб-сайт делал (сделано с помощью Ctrl + -):
веб-сайт sega.com уменьшен в маленьком окне браузера.
и вот код, весь CSS находится в html-файл:
Welcome to Sega Online
body {
height: 100%;
background-color: #000000;
}
.wrapper {
display: flex;
align-items: center;
justify-content: center;
height: 100%;
margin: auto;
}
.container {
display: flex;
flex-wrap: wrap;
align-items: flex-start;
justify-content: center;
width: 550px;
}
.toprow {
display: flex;
align-items: center;
flex-direction: row;
justify-content: space-between;
text-align: center;
}
Want to get in on the greatest video game promotion ever?[/b][b]
[img]/sega/img/spotlight.gif[/img]
A low-cost, easy-to-use alternative to access the World Wide Web using your Sega Saturn![/b]
[img]/sega/img/buzz.gif[/img]
[img]/sega/img/centernew.gif[/img]
[img]/sega/img/games.gif[/img]
[img]/sega/img/central.gif[/img]
[img]/sega/img/recroom.gif[/img]
Я попробовал много разных методов и решений, и многие из них не сработали или не дали того эффекта, который я искал. Я также искал в Интернете, чтобы узнать, есть ли у кого-нибудь то же самое, но безуспешно.
В основном я пытался использовать гибкие поля для хранения содержимого страницы, но все всегда оставалось постоянной ширины.
P.S. У меня 0 профессионального опыта программирования, поэтому, возможно, я что-то пропустил или сделал неправильно. Не стесняйтесь предлагать лучшие способы структурирования моего кода.
Возможно, это не лучший способ спросить, о чем я спрашиваю, но я не знаю, как еще это сказать.[b]У меня есть воссозданная версия веб-сайта sega.com 1996 года. Я пытался переделать макет без использования таблиц, как раньше, и думаю, что это выглядит нормально.
Но проблема в том, что теперь, если я сожму окно браузера до ширины менее 550 пикселей. содержимое страницы просто выходит за пределы окна, что не идеально. Поскольку макет и расположение всего на странице важны, я хотел бы сделать так, чтобы, когда ширина устройства меньше ширины страницы (550 пикселей), вся страница и ее содержимое масштабировались, чтобы соответствовать этой ширине, без изменения положения или относительных размеров контента. Вот как выглядит сайт: />воссоздание веб-сайта sega.com вот что он делает, когда его размер становится меньше его ширины: веб-сайт sega.com выходит за границы браузера вот примерное то, что я хочу, чтобы веб-сайт делал (сделано с помощью Ctrl + -): веб-сайт sega.com уменьшен в маленьком окне браузера. и вот код, весь CSS находится в html-файл:
Want to get in on the greatest video game promotion ever?[/b][b] [img]/sega/img/spotlight.gif[/img]
A low-cost, easy-to-use alternative to access the World Wide Web using your Sega Saturn![/b]
[img]/sega/img/buzz.gif[/img]
[img]/sega/img/centernew.gif[/img]
[img]/sega/img/games.gif[/img]
[img]/sega/img/central.gif[/img]
[img]/sega/img/recroom.gif[/img]
[/code]
Я попробовал много разных методов и решений, и многие из них не сработали или не дали того эффекта, который я искал. Я также искал в Интернете, чтобы узнать, есть ли у кого-нибудь то же самое, но безуспешно.
В основном я пытался использовать гибкие поля для хранения содержимого страницы, но все всегда оставалось постоянной ширины. P.S. У меня 0 профессионального опыта программирования, поэтому, возможно, я что-то пропустил или сделал неправильно. Не стесняйтесь предлагать лучшие способы структурирования моего кода.