Удаление переполнения-x: скрыто; когда страница сведена к минимуму

Я пробовал формулировать этот вопрос разными способами в Google. Я нашел один результат с похожим вопросом. Реакция заключалась в том, что вопрос был слишком расплывчатым. Это будет мой первый вопрос, я сделаю все возможное, чтобы попытаться быть максимально подробным. Сама страница, на которую задан этот вопрос, не имеет полосы прокрутки внизу, предлагая overflow-x:hidden. Однако при нажатии на значок восстановления вниз в правом верхнем углу страницы, слева от значка закрытия, вы заметите, что теперь отображается полоса прокрутки x или слева направо. Это тот эффект, который я пытаюсь достичь. Как написать мою страницу, где она не имеет левой полосы правого прокрутки, пока она не будет минимизирована? Вот код, который я имею в CSS:Удаление переполнения-x: скрыто; когда страница сведена к минимуму

body { 
overflow-x:hidden; 
overflow-y:auto; 
width:1650px; 
max-width:1650px; background-image:url('LiraBG5.png'), url('LiraBG3.png'); 
background-repeat:repeat-x, repeat; height:100%; 
}

Для HTML:

<!DOCTYPE html> 
<html>  
<head>  
<link href="Lira.css" rel="stylesheet" type="text/css" />  
</head>  
<body id="body">  
</body>  
</html>

Я попытался overflow-x:auto; вместо overflow-x:hidden; однако это приводит к странице, имеющей х или слева направо свитка бар, когда это максимизируется, что я пытаюсь избежать. Возможно ли, что для этого эффекта может потребоваться JavaScript?

источник

2015-02-20 Bryan Lira

Привет, добро пожаловать в SO. Люди могут помочь вам лучше, если вы разместили соответствующий код из своего проекта или если бы вы дублировали свою проблему с помощью JS.Fiddle (http://jsfiddle.net/). Чтение через ваш вопрос сейчас очень запутанно и код опубликовано не очень полезно. – crazymatt

Ширина 1650px слишком много для веб-сайта. Пожалуйста, прочитайте и понимайте удобство использования веб-сайтов. Вы можете установить 'width' на 100% и установить минимальное значение witdh следующим образом:' min-width'. –

@crazymatt Прекратить использование jsFiddle на SO, вы можете использовать встроенный ** фрагмент кода **, который делает то же самое. – tleb

Вы не хотите overflow-x: hidden - это не даст вам полосу прокрутки. Удалить, что из тела и попытаться что-то вроде этого (запустить фрагмент и нажмите кнопку «полную страницу», чтобы увидеть его в действии)

#content { 
 
    width: 1000px; 
 
    margin: 0 auto; 
 
    background: #aaa; 
 
}

<div id="content">Content here</div>

Это говорит div зафиксировать ее размер на 1000 пикселей и margin: 0 auto говорит, что он расположен горизонтально, если есть место. Если нет места, вы получите полосу прокрутки.

источник

2015-02-20 22:59:42 CupawnTae

Да, это работает для меня. –

Элемент HTML документа по умолчанию имеет overflow: auto. Это приводит к появлению полосы прокрутки, когда содержимое внутри документа выходит за пределы границ окна браузера.

В случае данного сайта. Существует центрированный div, который имеет ширину 1000px. Когда ширина окна браузера уменьшается ниже 1000px, тогда переполнение элемента html будет отображаться по умолчанию.

В качестве примечания стороны: Многие современные веб-сайты построены с учетом адаптивной структуры (например, Bootstrap). Эти адаптивные среды гарантируют, что все содержимое видимо в пределах области просмотра независимо от размера окна и, следовательно, устраняет необходимость горизонтальной прокрутки.

источник

2015-02-20 23:08:35 Jackson

Удаление переполнения-x: скрыто; когда страница сведена к минимуму

ответ

Смежные вопросы