PDA

Click to See Complete Forum and Search --> : colors in text area

georgeafi
02-25-2003, 02:39 PM
Hey i was wondering if there is a way to make the backround a different color than white in a text area? I want to make it black. A text area is the only way i can think of to have and area to make updates and have its own scroll bar. Also, is there a way to change the color of the scroll bar? I cant find it on any of the html tutorials. Thanks
Charles
02-25-2003, 02:43 PM
<textarea style="background-color:#000000; color:#ff0000">Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat.</textarea>
Robert Wellock
02-25-2003, 02:47 PM
There is no official way to change the scrollbar colour using CSS alone although you may be able to change the background colour.

<style type="text/css">
<!--
textarea { background-color: black; color: white; }
-->
</style>

Charles just beat me to the post.
georgeafi
02-25-2003, 03:12 PM
Ok thanks guys, i did a seach and found the code to change the scroll bars.

One more question though. Is there a way to get rid of the border around the text area. I plan on having the text in the text area scroll up and down in front of a picture without the picture moving if i can. if not thats cool.
Charles
02-25-2003, 03:19 PM
<textarea style="border:0px; background-color:#000000; color:#ff0000">Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat.</textarea>
Robert Wellock
02-26-2003, 12:42 PM
I would like to know what exactly you were trying to achieve, if it were purely stylistic in nature you could have used CSS to create a <div> of a given dimension, which would allow scrollbars, or borders if you required them, or not for example:


<?xml version="1.0" encoding="UTF-8"?>
<!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">
<head>
<title>Overflow to Scroll...</title>
<style
type="text/css">
<!--
.auto {
border: 1px solid #ccc;
background: #f6f6f6;
height: 110px;
margin: 20px;
width: 500px;
overflow: scroll;
color: green;
}
-->
</style>
</head>

<body>
<div
class="auto">
Lorem ipsum dolor sit amet, consectetuer adipiscing elit.
Praesent imperdiet, nunc nec cursus sagittis, diam ipsum
mattis turpis, non blandit wisi quam ut dolor. Nullam quis
leo vitae orci tristique commodo. Donec mauris elit, mollis
vel, pharetra sit amet, sodales ac, nisl. Pellentesque tempus
nisl quis sapien gravida bibendum. Integer quis libero sit
amet odio lobortis rhoncus. Ut eu lectus. Proin augue wisi,
semper quis, dictum vitae, fermentum nec, nibh. Vestibulum
scelerisque, diam sed mattis mollis, elit magna aliquam sem,
eget imperdiet felis pede at metus. Curabitur pharetra
imperdiet augue. Duis dignissim dapibus mauris. Etiam quis
quam ac nibh commodo porttitor.
</div>
</body>
</html>