Javascript-форум (https://javascript.ru/forum/)
-   (X)HTML/CSS (https://javascript.ru/forum/xhtml-html-css/)
-   -   скролл для длинного текста не появляется... (https://javascript.ru/forum/xhtml-html-css/13135-skroll-dlya-dlinnogo-teksta-ne-poyavlyaetsya.html)

dschmitz 17.11.2010 06:44
скролл для длинного текста не появляется...
 
на месте TEXT TEXT TEXT у меня довольно длинный текст и на странице по высоте не помещается. но никакого скролла по умолчанию не появляется, текст просто остается обрезанным. подскажите, пожалуйста, как его правильно упаковать в div?

<body>
            
         <div id="wrapper">
        
        <div id="text"><p>TEXT TEXT TEXT</p> </div>
        
    </div>
    
</body>




Код:
body {
background: #111 url(../images/bg.jpg) no-repeat left top fixed;
position: relative;
}


#wrapper {
background:url(../images/pattern.gif) repeat;
width: 100%;
height:100%;
position:fixed;
z-index: 100;
}


#text {
margin-top: 30px;
margin-left: 20px;
height:auto;
}
#text p{
      font-family: 'Arial Bold',Arial,sans-serif;
font-size: 16px;
letter-spacing:-0.5px;
padding:0px;
border:none;
color: #fff;
text-decoration: none;
}

ksa 17.11.2010 08:53
dschmitz, не совсем понятно что ты пытаешься сделать в целом... Зачем например

#wrapper {
background:url(../images/pattern.gif) repeat;
width: 100%;
height:100%;
position:fixed;
z-index: 100;
}


И где бы ты хотел получить прокрутку?

dschmitz 17.11.2010 16:38
прокручивать нужно только текст, но с помощью стандартного броузеровского скролла. текст лежит на подложке из фоновой картинки и сетки, заполяющей всю страницу. эта подложка прокручиваться не должна, только текст.

Sweet 17.11.2010 16:53
Цитата:
Сообщение от dschmitz
но никакого скролла по умолчанию не появляется
У дива по умолчанию нет скролла. Используй
overflow: scroll;

dschmitz 17.11.2010 19:55
так вот скролл должен появиться не у дива, а у браузера

ksa 17.11.2010 22:18
dschmitz, если он появится у браузера - начнётся прокрутка всего твоего содержимого...
Цитата:
Сообщение от dschmitz
подложка прокручиваться не должна
Покажи картинкой что же тебе нужно.

`p r o x y 27.11.2010 02:34
как понимаю такое вот нужно:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" dir="ltr" lang="ru">
<head>

<style>
*, html{
	margin: 0;
	padding: 0;
}

#wrapper{
	margin: 0 auto;
	width: 990px;
	background: #cecece;
}

#text_hidden{
	display: none;
}

p{
	line-height: 50px;
}
</style>

<script type="text/javascript">
function showHideText(e){
	var e = e || window.event;
	if (e.type == 'mouseover') document.getElementById('text_hidden').style.display = 'block';
	else document.getElementById('text_hidden').style.display = 'none';
}
</script>

</head>
<body>

<div id="wrapper">
	<div id="text">
		<p>TEXT TEXT TEXT</p>
		<p>TEXT TEXT TEXT</p>
		<div onmouseover="showHideText(event)" onmouseout="showHideText(event)">
			наведи на меня
			<div id="text_hidden">
				<p>TEXT TEXT TEXT</p>
				<p>TEXT TEXT TEXT</p>
				<p>TEXT TEXT TEXT</p>
				<p>TEXT TEXT TEXT</p>
				<p>TEXT TEXT TEXT</p>
				<p>TEXT TEXT TEXT</p>
				<p>TEXT TEXT TEXT</p>
				<p>TEXT TEXT TEXT</p>
				<p>TEXT TEXT TEXT</p>
				<p>TEXT TEXT TEXT</p>
				<p>TEXT TEXT TEXT</p>
				<p>TEXT TEXT TEXT</p>
				<p>TEXT TEXT TEXT</p>
				<p>TEXT TEXT TEXT</p>
				<p>TEXT TEXT TEXT</p>
				<p>TEXT TEXT TEXT</p>
				<p>TEXT TEXT TEXT</p>
				<p>TEXT TEXT TEXT</p>
				<p>TEXT TEXT TEXT</p>
				<p>TEXT TEXT TEXT</p>
				<p>TEXT TEXT TEXT</p>
				<p>TEXT TEXT TEXT</p>
				<p>TEXT TEXT TEXT</p>
				<p>TEXT TEXT TEXT</p>
				<p>TEXT TEXT TEXT</p>
				<p>TEXT TEXT TEXT</p>
				<p>TEXT TEXT TEXT</p>
				<p>TEXT TEXT TEXT</p>
				<p>TEXT TEXT TEXT</p>
				<p>TEXT TEXT TEXT</p>
				<p>TEXT TEXT TEXT</p>
				<p>TEXT TEXT TEXT</p>
				<p>TEXT TEXT TEXT</p>
				<p>TEXT TEXT TEXT</p>
				<p>TEXT TEXT TEXT</p>
				<p>TEXT TEXT TEXT</p>
				<p>TEXT TEXT TEXT</p>
				<p>TEXT TEXT TEXT</p>
				<p>TEXT TEXT TEXT</p>
				<p>TEXT TEXT TEXT</p>
				<p>TEXT TEXT TEXT</p>
				<p>TEXT TEXT TEXT</p>
				<p>TEXT TEXT TEXT</p>
				<p>TEXT TEXT TEXT</p>
				<p>TEXT TEXT TEXT</p>
				<p>TEXT TEXT TEXT</p>
				<p>TEXT TEXT TEXT</p>
				<p>TEXT TEXT TEXT</p>
				<p>TEXT TEXT TEXT</p>
				<p>TEXT TEXT TEXT</p>
				<p>TEXT TEXT TEXT</p>
				<p>TEXT TEXT TEXT</p>
				<p>TEXT TEXT TEXT</p>
				<p>TEXT TEXT TEXT</p>
				<p>TEXT TEXT TEXT</p>
				<p>TEXT TEXT TEXT</p>
				<p>TEXT TEXT TEXT</p>
				<p>TEXT TEXT TEXT</p>
				<p>TEXT TEXT TEXT</p>
				<p>TEXT TEXT TEXT</p>
				<p>TEXT TEXT TEXT</p>
				<p>TEXT TEXT TEXT</p>
				<p>TEXT TEXT TEXT</p>
				<p>TEXT TEXT TEXT</p>
				
			</div>
		</div>
	</div>
</div>

</body>
</html>


Часовой пояс GMT +3, время: 16:36.