2014-05-29 2 views
-4

Я пытаюсь сделать простой веб-приложение, но у меня возникли некоторые проблемы с позиционированием моего DIV-хКак позиционировать множественным ДИВ-х

Я попытался сделать так, у меня есть 1 large bar на top с 100% width , 1 large bar на bottom с 100% width и навигационным меню на стороне, которая застряла влево и точно соответствует двум другим барам. Я также хочу, чтобы он оставался там, где я прокручиваю вниз.

Код я использовал для навигации по меню является

{background-color: blue; 
    position: fixed; 
    width: 15%; 
    height: 80%; 
    margin-top: 7%; 
    margin-bottom: 3% 
} 

для верхней панели

{background-color: red; 
    position: fixed; 
    width: 100%; 
    height: 7%; 
    margin-top: 0; 
    margin-bottom: 93%; 
} 

и колонтитула

{background-color: green; 
    position: fixed; 
    width: 100%; 
    height: 3%; 
    margin-top: 97%; 
    margin-bottom: 0; 
} 

в DIV являются аль размещены в корпусе например

<body><div id="top"></div><div id="menu"></div><div id="footer"></div></body> 

Меню помечено так, но верхний и нижний колонтитулы застряли в верхней части страницы.

Спасибо всем, кто может помочь мне

+1

Нужно посмотреть ваш код – WillardSolutions

ответ

0

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

#menu { 
    background-color: blue; 
    position: fixed; 
    width: 15%; 
    height: 90%; 
    top: 7%; 
    left: 0; 
} 
#top { 
    background-color: red; 
    position: fixed; 
    width: 100%; 
    height: 7%; 
    top: 0; 
    left: 0; 
} 
#footer { 
    background-color: green; 
    position: fixed; 
    width: 100%; 
    height: 3%; 
    bottom: 0; 
    left: 0; 
} 
+0

О да, это действительно помогло мне :) Большое вам спасибо! – KO3D

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