473,385 Members | 1,402 Online
Bytes | Software Development & Data Engineering Community
Post Job

Home Posts Topics Members FAQ

Join Bytes to post your question to a community of 473,385 software developers and data experts.

Drop down list using CSS

2
Can any one told me that how can i format the drop down list using CSS
May 3 '06 #1
6 141754
kestrel
1,071 Expert 1GB
format it as in css styles?
let me know what kinda styles you want,
bgcolor
font color
stuff like that

and ill write you up the code
Aug 1 '06 #2
kestrel
1,071 Expert 1GB
just put things like this into the input drop down, and all the options that follow.
Expand|Select|Wrap|Line Numbers
  1. style="background: black; color: red; text-decoration; none; border: 1px solid red;"
just experiment with that kinda stuff

search google for more things you can add,


hope i could help
Aug 1 '06 #3
ronverdonk
4,258 Expert 4TB
Have a look at Stu Nicholls site, which is dedicated to CSS and usage. Contains tons of free samples, including drop down lists, menu's, layouts, boxes and the lot.

See:
http://www.cssplay.co.uk/menus/index.html

Ronald :cool:
Aug 4 '06 #4
jitu78
30
Hi,

Make a class for select box, where you can define styles for select box.

See sample code below,
<style>
select.style01 {border:1px solid #A5A5A5; backgorund-color:#D0D0D0}
select.style01 option {border-bottom:1px solid #dadada}
</style>

<html>
<select class="style01">
<option>Menu Item 01</option>
<option>Menu Item 02</option>
</select>
</html>
Aug 29 '06 #5
Zapman
2
This is one of the typs of dropdowns I Wanted. and works great but I was also needing to know How do I make one like at the top of this page. When scrollbar highlights forums or articles the links popdown.

if that makes any sense




Hi,

Make a class for select box, where you can define styles for select box.

See sample code below,
<style>
select.style01 {border:1px solid #A5A5A5; backgorund-color:#D0D0D0}
select.style01 option {border-bottom:1px solid #dadada}
</style>

<html>
<select class="style01">
<option>Menu Item 01</option>
<option>Menu Item 02</option>
</select>
</html>
Sep 2 '07 #6
If you're looking for a CSS drop-down menu a simple version would be like this:

HTML:

Expand|Select|Wrap|Line Numbers
  1.  
  2. <ul>
  3.  
  4.   <li>Menu Link 1</li>
  5.   <li>Menu Link 2</li>
  6.   <li class="menu-parent">Menu Link 3
  7.  
  8.     <ul class="menu-child">
  9.  
  10.       <li>Sub Menu Link 1</li>
  11.       <li>Sub Menu Link 2</li>
  12.       <li>Sub Menu Link 3</li>
  13.  
  14.     </ul>
  15.  
  16.   </li>
  17.  
  18. </ul>
  19.  
  20.  
This will nest a list within an item of the parent list so we can show it using CSS

CSS:

Expand|Select|Wrap|Line Numbers
  1. .menu-parent{
  2.   position:relative; //This sets the list element as the reference point for any childs position
  3. }
  4.  
  5. .menu-child{
  6.   display:none;          //This will hide the submenu at first
  7.   position:absolute;     //This will make the position fixed relative to the parent
  8.   top:-6px;              //vertical offset from the top of the parent element
  9.   left:0px;              //horizontal offset from the parent element
  10.   z-index:10;            //This will make sure the submenu is on top of whatever is around it
  11. }
  12.  
  13. .menu-parent:hover .menu-child{
  14.   display:block; //Show the submenu when you hover over a parent
  15. }
  16.  
  17.  
This is very basic and does not include any actual styling just the css required for it to function.
Oct 23 '11 #7

Sign in to post your reply or Sign up for a free account.

Similar topics

3
by: Miguel Dias Moura | last post by:
Hello, i have an ASP.NET / VB page where i have a few 4 groups of Drop Down Lists. Each group of Drop Down Lists include 3 Drop Down Lists for date such as: DAY, MONTH, and YEAR. I don't want...
13
by: Leszek Taratuta | last post by:
Hello, I have several drop-down lists on my ASP.NET page. I need to keep data sources of these lists in Session State. What would be the most effective method to serialize this kind of data...
2
by: Yoshitha | last post by:
hi I have 2 drop down lists in my application.1st list ontains itmes like java,jsp,swings,vb.net etc.2nd list contains percentage i.e it conatains the items like 50,60,70,80,90,100. i will...
2
by: Dave A | last post by:
I am stuggling with databinding a drop down list, hooking into the SelectedIndexChanged and attempting to avoid using the viewstate. The drop down list is quite large so I would prefer to avoid...
8
by: Ed Dror | last post by:
Hi there ASP.NET 2.0 VB & SQL Express Lest take Northwind Categories Products as example I create a table that hold these two together and I create a stored procedure like select ProductID,...
5
by: ashok893 | last post by:
I'm using two drop down list ina form. I have generated the first drop down list from MySQL database. When i select an option from first drop down list, i have to generate second drop down list...
4
by: TycoonUK | last post by:
Hi, As I do not have IE7 on my computer, I was wondering if there is a fault in my CSS Menu when using IE7. Please can someone look at my site - http://www.worldofmonopoly.co.uk and tell me...
3
by: penny111 | last post by:
Hi there, For my application, i need to have 3 drop down lists 1. drop down list of folder names 2. drop down list of documents in the folder selected 3. drop down list of instances of the...
8
by: dskanth | last post by:
I have 4 drop down lists, namely Location, country, State and City. Ex: Location: Asia, Country: India, State: Andhra Pradesh, City: Hyderabad. If i select any option in the Location drop down...
3
by: jcassan | last post by:
Hello folks. I am new to these forums and have something, which has been stumping me for little while. I am using pspell to spellcheck a scrolling textbox (textarea) containing user input. I...
1
by: CloudSolutions | last post by:
Introduction: For many beginners and individual users, requiring a credit card and email registration may pose a barrier when starting to use cloud servers. However, some cloud server providers now...
0
isladogs
by: isladogs | last post by:
The next Access Europe User Group meeting will be on Wednesday 3 Apr 2024 starting at 18:00 UK time (6PM UTC+1) and finishing by 19:30 (7.30PM). In this session, we are pleased to welcome former...
0
by: taylorcarr | last post by:
A Canon printer is a smart device known for being advanced, efficient, and reliable. It is designed for home, office, and hybrid workspace use and can also be used for a variety of purposes. However,...
0
by: aa123db | last post by:
Variable and constants Use var or let for variables and const fror constants. Var foo ='bar'; Let foo ='bar';const baz ='bar'; Functions function $name$ ($parameters$) { } ...
0
by: ryjfgjl | last post by:
If we have dozens or hundreds of excel to import into the database, if we use the excel import function provided by database editors such as navicat, it will be extremely tedious and time-consuming...
0
by: emmanuelkatto | last post by:
Hi All, I am Emmanuel katto from Uganda. I want to ask what challenges you've faced while migrating a website to cloud. Please let me know. Thanks! Emmanuel
0
BarryA
by: BarryA | last post by:
What are the essential steps and strategies outlined in the Data Structures and Algorithms (DSA) roadmap for aspiring data scientists? How can individuals effectively utilize this roadmap to progress...
1
by: nemocccc | last post by:
hello, everyone, I want to develop a software for my android phone for daily needs, any suggestions?
0
by: Hystou | last post by:
There are some requirements for setting up RAID: 1. The motherboard and BIOS support RAID configuration. 2. The motherboard has 2 or more available SATA protocol SSD/HDD slots (including MSATA, M.2...

By using Bytes.com and it's services, you agree to our Privacy Policy and Terms of Use.

To disable or enable advertisements and analytics tracking please visit the manage ads & tracking page.