stalker12 S stalker12 Регистрация 5 Окт 2013 Сообщения 82 Репутация 0 Спасибо 0 Монет 0 6 Май 2023 #1 @media only screen and (min-width: 1900px) { #contentContainer { width: 1900px; border: 5px black solid; overflow: hidden; } } @media only screen and (min-width: 1800px) { #contentContainer { width: 1800px; border: 5px black solid; overflow: hidden; } } @media only screen and (min-width: 1700px) { #contentContainer { width: 1700px; border: 5px black solid; overflow: hidden; } } @media only screen and (min-width: 1600px) { #contentContainer { width: 1600px; border: 5px black solid; overflow: hidden; } } @media only screen and (min-width: 1500px) { #contentContainer { width: 1500px; border: 5px black solid; overflow: hidden; } } @media only screen and (min-width: 1400px) { #contentContainer { width: 1400px; border: 5px black solid; overflow: hidden; } } @media only screen and (min-width: 1300px) { #contentContainer { width: 1300px; border: 5px black solid; overflow: hidden; } } @media only screen and (min-width: 1200px) { #contentContainer { width: 1200px; border: 5px black solid; overflow: hidden; } } @media only screen and (min-width: 1100px) { #contentContainer { width: 1100px; border: 5px black solid; overflow: hidden; } } @media only screen and (min-width: 1000px) { #contentContainer { width: 1000px; border: 5px black solid; overflow: hidden; } } @media only screen and (min-width: 900px) { #contentContainer { width: 900px; border: 5px black solid; overflow: hidden; } } @media only screen and (min-width: 800px) { #contentContainer { width: 800px; border: 5px black solid; overflow: hidden; } } @media only screen and (min-width: 7000px) { #contentContainer { width: 700px; border: 5px black solid; overflow: hidden; } } @media only screen and (min-width: 600px) { #contentContainer { width: 600px; border: 5px black solid; overflow: hidden; } } @media only screen and (min-width: 500px) { #contentContainer { width: 500px; border: 5px black solid; overflow: hidden; } } @media only screen and (min-width: 400px) { #contentContainer { width: 400px; border: 5px black solid; overflow: hidden; } } @media only screen and (min-width: 300px) { #contentContainer { width: 300px; border: 5px black solid; overflow: hidden; } } @media only screen and (min-width: 200px) { #contentContainer { width: 200px; border: 5px black solid; overflow: hidden; } } @media only screen and (min-width: 100px) { #contentContainer { width: 100px; border: 5px black solid; overflow: hidden; } }
@media only screen and (min-width: 1900px) { #contentContainer { width: 1900px; border: 5px black solid; overflow: hidden; } } @media only screen and (min-width: 1800px) { #contentContainer { width: 1800px; border: 5px black solid; overflow: hidden; } } @media only screen and (min-width: 1700px) { #contentContainer { width: 1700px; border: 5px black solid; overflow: hidden; } } @media only screen and (min-width: 1600px) { #contentContainer { width: 1600px; border: 5px black solid; overflow: hidden; } } @media only screen and (min-width: 1500px) { #contentContainer { width: 1500px; border: 5px black solid; overflow: hidden; } } @media only screen and (min-width: 1400px) { #contentContainer { width: 1400px; border: 5px black solid; overflow: hidden; } } @media only screen and (min-width: 1300px) { #contentContainer { width: 1300px; border: 5px black solid; overflow: hidden; } } @media only screen and (min-width: 1200px) { #contentContainer { width: 1200px; border: 5px black solid; overflow: hidden; } } @media only screen and (min-width: 1100px) { #contentContainer { width: 1100px; border: 5px black solid; overflow: hidden; } } @media only screen and (min-width: 1000px) { #contentContainer { width: 1000px; border: 5px black solid; overflow: hidden; } } @media only screen and (min-width: 900px) { #contentContainer { width: 900px; border: 5px black solid; overflow: hidden; } } @media only screen and (min-width: 800px) { #contentContainer { width: 800px; border: 5px black solid; overflow: hidden; } } @media only screen and (min-width: 7000px) { #contentContainer { width: 700px; border: 5px black solid; overflow: hidden; } } @media only screen and (min-width: 600px) { #contentContainer { width: 600px; border: 5px black solid; overflow: hidden; } } @media only screen and (min-width: 500px) { #contentContainer { width: 500px; border: 5px black solid; overflow: hidden; } } @media only screen and (min-width: 400px) { #contentContainer { width: 400px; border: 5px black solid; overflow: hidden; } } @media only screen and (min-width: 300px) { #contentContainer { width: 300px; border: 5px black solid; overflow: hidden; } } @media only screen and (min-width: 200px) { #contentContainer { width: 200px; border: 5px black solid; overflow: hidden; } } @media only screen and (min-width: 100px) { #contentContainer { width: 100px; border: 5px black solid; overflow: hidden; } }
TDR T TDR Регистрация 25 Окт 2013 Сообщения 74 Репутация 0 Спасибо 0 Монет 0 6 Май 2023 #2 Потому, что ты перечислил все правила не в том порядке. Правило min-width: 100px перекрывает любое правило, размещённое выше - т.к. соответствует ЛЮБОЙ ширине окна от 100px и ДО БЕСКОНЕЧНОСТИ. min-width: 100px означает: ширина окна >= 100px. max-width: 100px означает: ширина окна <= 100px. Правила min-width должны перечисляться от минимального значения сверху к максимальному значению снизу. Только тогда они будут нормально работать. А вот правила max-width как раз должны перечисляться от максимального значения сверху к минимальному значению снизу. А ещё у тебя там 7000px вместо 700px.
Потому, что ты перечислил все правила не в том порядке. Правило min-width: 100px перекрывает любое правило, размещённое выше - т.к. соответствует ЛЮБОЙ ширине окна от 100px и ДО БЕСКОНЕЧНОСТИ. min-width: 100px означает: ширина окна >= 100px. max-width: 100px означает: ширина окна <= 100px. Правила min-width должны перечисляться от минимального значения сверху к максимальному значению снизу. Только тогда они будут нормально работать. А вот правила max-width как раз должны перечисляться от максимального значения сверху к минимальному значению снизу. А ещё у тебя там 7000px вместо 700px.
Chaka C Chaka Регистрация 21 Ноя 2013 Сообщения 84 Репутация 0 Спасибо 0 Монет 0 6 Май 2023 #3 7000px исправь на 700px
1985AndryxA1985 1 1985AndryxA1985 Регистрация 16 Июн 2013 Сообщения 70 Репутация 0 Спасибо 0 Монет 0 6 Май 2023 #4 У тебя не правильная логика. У тебя медиа запрос самый первый срабатывает при ширине экрана более 100px. Естественно он будет срабатывать всегда. Замени min-width на max-width. Лично я именно их всегда использую. Ну и 7000px многовато
У тебя не правильная логика. У тебя медиа запрос самый первый срабатывает при ширине экрана более 100px. Естественно он будет срабатывать всегда. Замени min-width на max-width. Лично я именно их всегда использую. Ну и 7000px многовато
Azuat A Azuat Регистрация 3 Дек 2013 Сообщения 94 Репутация 0 Спасибо 0 Монет 0 6 Май 2023 #5 я вижу что нет открывающей скобки, если точнее, то это невалидный html / xml-код