-1
Итак, у меня есть этот нижний колонтитул, который я хочу разместить в нижней части каждой страницы моего сайта. Я пробовал использовать абсолютную и фиксированную позицию, но не работал. Вот что у меня есть:Как сохранить нижний колонтитул внизу каждой страницы моего веб-сайта?
<footer class="footer">
<div id="ft">
<div class="container">
<div class="footer-grids">
<div class="col-md-3 footer-grid">
<h3>Анкети</h3>
<ul>
<li><a href="{{ url('https://docs.google.com/forms/d/1fpkJ1ndBO4YmyAk2UEfFYcR7m0HvAG-xH-dbolGtyE0/viewform') }}"
target="new">Анкета – нашият екологичен отпечатък</a></li>
<li><a href=" {{ url('https://docs.google.com/forms/d/1wuH3PC8Bl4YqZUwv_bYRMUC6QpV_JoZJnhDIEd3HtQk/viewform') }}"
target="new">Анкета с цел проучване обучението по чужд език.</a></li>
</ul>
</div>
<div class="col-md-3 footer-grid">
<h3>ДЗИ и НВО</h3>
<ul>
<li><a href="{{ url('http://www.mon.bg/?') }}" target="new">18.05.2016 г. – ДЗИ по БЕЛ и НВО в VII клас
по БЕЛ</a></li>
<li><a href="{{ url('http://www.mon.bg/?') }}" target="new">20.05.2016 г. – Втори ДЗИ и НВО в VII клас
по математика</a></li>
</ul>
</div>
<div class="col-md-3 footer-grid">
<h3>Други</h3>
<ul>
<li><a href="students#stipendii">Отпускане на стипендии</a></li>
<li><a href="{{ url('pdf/grafik_vakancii.pdf') }}" target="new">График на ваканциите и неучебните
дни за 2015/2016г.</a></li>
</ul>
</div>
<div class="col-md-3 footer-grid">
<h3>Други</h3>
<ul>
<li><a href="#">PRESENTATIONS</a></li>
<li><a href="#">SEMINARS</a></li>
</ul>
</div>
<div class="clearfix"></div>
</div>
</div>
</div>
</footer>
и есть CSS-код:
.footer{
position: absolute;
bottom: 0;
width: 100%;
background:#393939;
}
#ft{
margin: 16px 0 0 5px;
color: rgb(249, 249, 184);
text-decoration: none;
}
#ft:hover{
text-decoration: none;
}
.footer-grid ul{
padding:0;
margin:0;
}
.footer-grid ul li{
background: url(../images/arrow.png) no-repeat 0px 6px;
list-style-type: none;
display: block;
padding-left: 23px;
line-height: 2em;
}
.footer-grid ul li a{
color: #757575;
font-size: 14px;
font-weight: 600;
}
.footer-grid ul li a:hover{
padding-left: 11px;
color:rgb(240, 226, 134);
}
.footer p {
margin:44px 0 0 0;
font-size:14px;
color: #c2c2c2;
font-weight: 600;
text-align:center;
}
.footer p a{
color:#fc3a3a;
}
.footer p a:hover{
color: #c2c2c2;
}
.footer-grid h3{
margin: 0 0 20px 0;
font-size: 25px;
font-family: Comfortaa;
color: rgb(240, 226, 134);
}
Я пытался исправить это в течение достаточно долгого времени, и я был бы признателен, если кто-то может дать мне руку это :)
Хотите ли вы, чтобы он отображал верхнюю часть контента, которая выходит за пределы нижней части страницы, или вы хотите, чтобы она была привязана к нижней части страницы, когда содержимое короткое? – zzzzBov
Я хочу, чтобы это было в нижней части каждой страницы. Но мои страницы не короткие и имеют прокрутку, поэтому проблема возникает. –
Из вашего описания это похоже на то, что вы задаете дублирующий вопрос по адресу http://stackoverflow.com/q/12239166/497418, но, пожалуйста, исправьте меня если я ошибаюсь и недопонимаю, что вам нужно. – zzzzBov