?
Solved

textarea style not showing in Firefox

Posted on 2005-04-21
5
Medium Priority
?
1,234 Views
Last Modified: 2012-05-05
The site I'm working on is www.photo.jedijay.net

If you open the site with IE the formatting of the textareas on right show up just fine, however if you open the site with firefox all the formatting for the textareas are gone.  Here is the CSS that I am using:

<style type="text/css">
<!--
.mytextarea {
   color: #00FFFF;
   background-color: #000080;
   border: 1
   scrollbar-base-color: #000080;
   scrollbar-arrow-color: black;
   scrollbar-track-color: #000080;
   scrollbar-face-color: #00FFFF;
   scrollbar-shadow-color: black;
   scrollbar-3dlight-color: black;
   scrollbar-darkshadow-color: black;
   scrollbar-highlight-color: black;
}
.mytext2 {
   color: #00FFFF;
   background-color: #000080;
   font-weight: bold;
}
.mytext {
   color: #00FFFF;
   background-color: #000080;
}
.mybutton {
   color: #00FFFF;
   background-color: #000080;
   font-weight: bold;
}

-->
</style>

Here is my code for the textarea (PHP):
echo "<textarea type='text' COLS='30' ROWS='30' NAME = 'desc' SIZE='100' WRAP='SOFT' class='mytextarea' READONLY>$output</TEXTAREA>";

Is this just a limitation of firefox right now or is there a simple fix?
0
Comment
Question by:SJMHelp1
  • 3
5 Comments
 
LVL 32

Accepted Solution

by:
Batalf earned 1000 total points
ID: 13833700
Firefox doesn't support scrollbar styles as IE does.

These styles

scrollbar-base-color: #000080;
   scrollbar-arrow-color: black;
   scrollbar-track-color: #000080;
   scrollbar-face-color: #00FFFF;
   scrollbar-shadow-color: black;
   scrollbar-3dlight-color: black;
   scrollbar-darkshadow-color: black;
   scrollbar-highlight-color: black;

are IE only.
0
 

Author Comment

by:SJMHelp1
ID: 13833869
Well done Batalf, I removed all the scrollbar styles and it came through fine on firefox.  

Would there be an easy way within the CSS to add the scrollbar styles if the user is viewing through IE?  I know I could do it within the code for the page but I really don't want to duplicate a bunch of stuff and add logic just to change the color of a scrollbar.  

Thanks again for the help.
0
 
LVL 30

Expert Comment

by:GrandSchtroumpf
ID: 13833975
>  Well done Batalf, I removed all the scrollbar styles and it came through fine on firefox.  
Does not come right on my side...
But adding this style fixes it:

textarea {
   color: #00FFFF;
   background-color: #000080;
}
0
 
LVL 32

Expert Comment

by:Batalf
ID: 13834018
You could remove the scrollbar styles from other browsers than IE in PHP by checking the environment variable HTTP_USER_AGENT for occurence of "MSIE" and "Win"

example:


.mytextarea{
   color: #00FFFF;
   background-color: #000080;
   border: 1px;
   <?
   if(stristr(getenv("HTTP_USER_AGENT"),"MSIE") && stristr(getenv("HTTP_USER_AGENT"),"WIN")){
         ?>
   scrollbar-base-color: #000080;
   scrollbar-arrow-color: black;
   scrollbar-track-color: #000080;
   scrollbar-face-color: #00FFFF;
   scrollbar-shadow-color: black;
   scrollbar-3dlight-color: black;
   scrollbar-darkshadow-color: black;
   scrollbar-highlight-color: black;
         <?
   }
   ?>


}
0
 
LVL 32

Expert Comment

by:Batalf
ID: 13834088
Also note the difference from

border: 1

to

border: 1px;

Since you're only setting the width, you can also use

border-width:1px;
0

Featured Post

VIDEO: THE CONCERTO CLOUD FOR HEALTHCARE

Modern healthcare requires a modern cloud. View this brief video to understand how the Concerto Cloud for Healthcare can help your organization.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

When applying CSS to your HTML, there are many different ways to select which element(s) the CSS applies to.  Some of these selectors are more commonly known and used than others - Here are the more common ones: #X - Matches an ID of X .X - Matche…
This is a how to build your own CSS3 slideshow and when I say CSS3 I mean just CSS with no javascript in sight! There a few examples online of how to do this but most just show you an example without any explanation, others make it more complicat…
In this tutorial viewers will learn how add a full-size background image to a webpage using CSS3. Create a new HTML document with an internal stylesheet.: In CSS, define the html element to have a background image. Use a high resolution image.: In t…
The viewer will learn the benefit of using external CSS files and the relationship between class and ID selectors. Create your external css file by saving it as style.css then set up your style tags: (CODE) Reference the nav tag and set your prop…
Suggested Courses
Course of the Month9 days, 7 hours left to enroll

621 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question