Форум Flasher.ru
Страница 1 из 2 1 2 >
Показывать 40 сообщений этой темы на одной странице

Форум Flasher.ru (http://www.flasher.ru/forum/index.php)
-   HTML/DHTML/CSS/JS/VB (http://www.flasher.ru/forum/forumdisplay.php?f=66)
-   -   top, bottom и overflow в CSS (http://www.flasher.ru/forum/showthread.php?t=75006)

TTS 02.02.2006 16:06
top, bottom и overflow в CSS
 
задача: оставить шапку вверху страницы, скролить только контент
Т.е. див с контентом должен начинаться от нижнего края шапки и тянуться до нижнего края окна браузера и иметь скролбар такой же высоты
в стиле дива с контентом я прописал (сто пикселей на шапку):
top: 100px;
bottom: 0px;
overflow: auto;

в фф это все работает прекрасно, а вот ие не понимает, растягивает див на всю ширину контента и скролит весь документ вместе с шапкой

как бы решить енту проблемку?

deathstorm 02.02.2006 16:47
есть мыслся, простая до безобразия
сделать 2 дива (одним по другим

TTS 02.02.2006 16:56
вопрос не понят до безобразия

если короче, нужно нарисовать див высотой на xxx пикселей меньше высоты окна браузера и прилепить его к нижнему краю окна браузера
средствами css
и чтоб везде работало

ие в принципе не понимает совместного использования top и bottom, равно как left&right. перспектива мрачная, в ней светит джаваскрипт...
а не хочется... ой как не хочется...

CAM 02.02.2006 19:44
podskazku ili rabo4ii primer?
ya kak to polgoda nazad imelsya :( no reshul :)

sorry za lat net vremeni na rabote v slepuu klikat'?

TTS 02.02.2006 19:51
Цитата:
Сообщение от CAM
podskazku ili rabo4ii primer?
Как тебе проще. Спасибо.
Я, честно говоря, начал уже с помощью таблицы лабать.
Тут, правда, еще одна проблема появилась. Но это потом, сначала сам голову поломаю

CAM 02.02.2006 20:04
<style type="text/css">

html {
width:100%; height:100%;
overflow:hidden;
}

body {
width:100%; height:100%;
margin:0; padding:0;
overflow:auto;
font-family:Arial;
font-size:12px;

}

#content {

text-align: center;
margin-top:15px;

}
#menu {
position:absolute;
top:0px;
background: url(images/bg_toolbar.png) repeat-x fixed;
width: 100%;
height: 30px;
}

#conteiner-txtbar {
padding-top:2px;
width:760px;
text-align: center;
margin-left: auto;
margin-right: auto;

}
</style>
</head>

<body>
<div id="menu">
<div id="conteiner-txtbar"></div>
</div>

CAM 02.02.2006 20:17
update :) eto nedodelanui

html {
width:100%; height:100%;
overflow: hidden;
}
body {
width:100%; height:100%; overflow:auto;
margin:0; padding:0;
font-family:Arial; font-size:12px;
text-align:center;
}
#menu {
position:absolute;
background: url(images/bg_toolbar.png) repeat-x fixed;
width:100%; height:30px;
right:17px; z-index:1;

}
#conteinerTxtBar {
width:760px;height:30px;
text-align: center;color:#CCC;
margin-left: auto; margin-right: auto;
background:url(images/topRight_bgMov.gif) no-repeat right top;
padding-bottom:4px;
}

TTS 02.02.2006 20:29
Ннннеее...
В моей задачке "overflow: auto" должно быть прописано не у боди, а у conteinerTxtBar. И высота его не 30px, а что-нить типа "100% минус высота шапки"

CAM 02.02.2006 23:18
conteinerTxtBar это и есть шапка
<body>
<div id="шапка-conteiner">
<div id="шапка"></div>
</div>
<div id="content h:100%">...</div>

есле не-то пришли jpeg layout-a
посмотрим удачиЖ)

TTS 03.02.2006 00:09
Вложений: 2
в фф это выглядит как надо
в ие див с контентом уползает за край экрана на 100рх, т.к. имеет высоту 100% и верхний отступ 100рх


Часовой пояс GMT +4, время: 08:17.
Страница 1 из 2 1 2 >
Показывать 40 сообщений этой темы на одной странице

Copyright © 1999-2008 Flasher.ru. All rights reserved.
Работает на vBulletin®. Copyright ©2000 - 2026, Jelsoft Enterprises Ltd. Перевод: zCarot
Администрация сайта не несёт ответственности за любую предоставленную посетителями информацию. Подробнее см. Правила.