2013-02-20 2 views
0


Я делаю некоторые отзывчивый CSS, и я хочу, чтобы иметь что-то вроде этого:распространения навигационной панели по всей странице

<body> 
<nav> 
<ul> 
<li>Asd</li> 
<li>sdf</li> 
</ul> 
</nav> 
<table> 
(Some wide table goes here) 
</table> 

Я определил СЧ как бар в верхней части страницы (= горизонтальная полоса) , С маленькими экранами (когда таблица слишком большая) появляется горизонтальная полоса прокрутки.

Моя проблема заключается в том, что при прокрутке по горизонтали навигационная панель переходит влево и оставляет пустое пространство с правой стороны. Я просто хочу, чтобы это было видно, чтобы сохранить впечатление от бара. Есть ли идеи, как это сделать?

Я знаю, что одна из них будет фиксированной, поэтому навигатор будет фиксироваться, но это также означает, что навигатор будет зафиксирован даже с помощью прокрутки по вертикали, чего я не хочу.

Я просто хочу, чтобы он был так же широк, как и вся страница (не так широко, как экран), а также можно прокручивать по вертикали. (Это совершенно не имеет значения для меня, если прокрутки содержимого нав также, когда горизонтальная прокрутка происходит или если содержание нав просто получает прокручивается и есть только нав фон (и Nav границу и так далее))

EDIT: http://imageshack.us/photo/my-images/39/201302202145541024x600s.png/

+0

Если таблица фактической таблицы значений, или она используется для целей макета? Вы всегда можете обернуть его в DIV с помощью переполнения-x: прокрутки. –

+0

Это расписание – user1080431

ответ

0

с CSS, position:absolute; left:0; (останавливает его движение от левой части веб-экрана, когда страница прокручивается.)

+0

Извините, но вы, вероятно, меня неправильно поняли. Я не возражаю против того, чтобы nav двигаться, моя проблема в том, что он не подходит для всего свободного пространства (это всего лишь один экран, и мне нужно, чтобы он был над всей страницей (например, два, три, тысячи экранов, в зависимости от ширина другого содержимого)) – user1080431

+0

Ohhhh! Мой плохой, я бы заглянул в javascript для этого. –

+0

И что JS вы предлагаете? Я пытаюсь сделать это целый день, но все еще есть некоторые ошибки при изменении размера страницы. Мне действительно удалось создать скрипт, который добавляет «paddingRight» для навигации, поэтому он заполняет весь документ document.body.scrollWidth', но У меня возникают проблемы при изменении размера страницы, потому что заполнение слишком велико (это приводит к тому, что страница на самом деле больше, чем необходимо, и отображает ненужную горизонтальную полосу прокрутки) – user1080431

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