Solved

Style sheet for combo box

Posted on 2003-12-05
5
946 Views
Last Modified: 2010-04-09
Dear all,
I change window's scroll bar to this :
SCROLLBAR-HIGHLIGHT-COLOR: #99ccff; SCROLLBAR-SHADOW-COLOR: #99ccff; SCROLLBAR-3DLIGHT-COLOR: #99ccff; SCROLLBAR-TRACK-COLOR: #d7ebff; SCROLLBAR-DARKSHADOW-COLOR: #99ccff; SCROLLBAR-BASE-COLOR: #ffffff;

How can change scroll bar for combobox (list box) to the same.

Thanks.
0
Comment
Question by:ethar1
  • 2
  • 2
5 Comments
 
LVL 33

Expert Comment

by:hongjun
ID: 9887338
An example

<select name="selDay" style="background: Silver; color: Maroon; font-family: Arial; font-size: x-small; border-style: none;">


hongjun
0
 
LVL 33

Expert Comment

by:hongjun
ID: 9887339
0
 
LVL 31

Accepted Solution

by:
seanpowell earned 500 total points
ID: 9887966
Hi ethar1,

I'm afraid you cannot change the color of the scrollbar in a select box. It is set by the Operating System.

Thanks,
georgemarian
0
 
LVL 8

Expert Comment

by:nishikanth
ID: 9910445
place this between the <head></head> tags

Code:

<style type="text/css">
BODY {
 scrollbar-face-color:"#800000";
scrollbar-arrow-color:"#808080">;
scrollbar-track-color:"#000000";
scrollbar-shadow-color:"#003366";
scrollbar-highlight-color:"#660066";
scrollbar-3dlight-color:''660066";
scrollbar-darkshadow-Color:"#";
}
</style>


-----------------------------------------------------------------------------

This is changing it with styles, you can link to an external style sheet to update all your pages at once

<style type="text/css">
BODY {
      SCROLLBAR-BASE-COLOR: #1293ee;
      SCROLLBAR-ARROW-COLOR: #FFFFFF;
}
SELECT {
      FONT-FAMILY: Verdana,Arial,Helvetica,sans-serif;
      FONT-SIZE: 11px;
      COLOR: #000000;
      BACKGROUND-COLOR: #CFCFCF
}
TEXTAREA, .bginput {
      FONT-SIZE: 12px;
      FONT-FAMILY: Verdana,Arial,Helvetica,sans-serif;
      COLOR: #000000;
      BACKGROUND-COLOR: #CFCFCF
}....

-----------------------------------------------------------------------------------


FYI - you can even use more properties:

{
background-image: url('../images/bg.gif');
background-color: #D7DFE9;
scrollbar-arrow-color: #375A83;
scrollbar-3dlight-color: #8D9FC0;
scrollbar-highlight-color: #8D9FC0;
scrollbar-face-color: #D7DFE9;
scrollbar-shadow-color: #8D9FC0;
scrollbar-darkshadow-color: #8D9FC0;
scrollbar-track-color: #ACB8C5;
}



0
 
LVL 31

Expert Comment

by:seanpowell
ID: 9911925
The question was how to change the scrollbar color for the "select" box. Not the window scrollbar. Without creating a dhtml select box (that may or may not function properly within a form environment) it cannot be done. It is set by the Operating System.
0

Featured Post

Free Tool: Path Explorer

An intuitive utility to help find the CSS path to UI elements on a webpage. These paths are used frequently in a variety of front-end development and QA automation tasks.

One of a set of tools we're offering as a way of saying thank you for being a part of the community.

Question has a verified solution.

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

Suggested Solutions

Title # Comments Views Activity
How to make footer stick to bottom 9 36
html border input line 7 13
AJAX Wordpress Not Reading Variable 2 27
Opening a new tab in IE using Powershell / HTML 2 20
SASS allows you to treat your CSS code in a more OOP way. Let's have a look on how you can structure your code in order for it to be easily maintained and reused.
This article discusses how to create an extensible mechanism for linked drop downs.
In this tutorial viewers will learn how to position items using CSS's three positioning types Create a new HTML document with an internal stylesheet.: Create another div in CSS and name it Absolute : Type "position:absolute;" and "top:10px; left:50p…
In this tutorial viewers will learn how to style transparent/translucent elements using alpha transparency in CSS Start with a normal styled element, such as a div.: Define its "background-color" property as "rgba (255, 255, 255, .5): The numbers in…

861 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