Tek-Tips is the largest IT community on the Internet today!

Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!

Register Log in
  • Congratulations derfloh on being selected by the Tek-Tips community for having the most helpful posts in the forums last week. Way to Go!

No border on list/menu

Status
Not open for further replies.
shawkz

shawkz

Programmer
Oct 25, 2005
84
GB
Hi

Does any one know how to make the border on a list/menu dissapear (make it white) so all you can see is the item in the list?

Kindest regards,

SHawkz
 
Sort by date Sort by votes
Do you mean an HTML unordered or ordered list (<ul> or <ol>) or a Select box form element? (<select>)

If it is the latter, as I suspect then I don't think you can. Their appearance is controlled by the browser/OS and as such you have no direct control over their appearance.

You could *try* some CSS. Something like:

Code: 
select { border:none; }

But I am not confident that would work.

Foamcow Heavy Industries - Web design and ranting
Buy Languedoc wines in the UK
 
Upvote 0 Downvote
Thanks for replying, i need to "remove" then border on a form item list/menu..
 
Upvote 0 Downvote
Here is an example...

<form name="form1" method="post" action="">
<input type="text" name="textfield" style="background-color:#FFFFFF;border-style:none">
<select name="select" style="background-color:#FFFFFF;border-style:none" size="10">
<option>1</option>
<option>2</option>
<option>3</option>
</select>
</form>

it works fine on a text field but not on the menu.

Can it be done?
 
Upvote 0 Downvote
Upvote 0 Downvote
BillRay said:
Don't you hate having to repeat yourself because posts don't get read?
Click to expand...

Just to remove a little temptation ;)

barcode_1.gif
 
Upvote 0 Downvote
That's not quite what was asked, but if you were going to go that route then may I suggest using the actual HTML elements for a list?

Code: 
<ul>
<li><a href="#">&nbsp;1 </a></li>
<li><a href="#">&nbsp;2 </a></li>
<li><a href="#">&nbsp;3 </a></li>
</ul>

You could, with some more CSS, create a select box style menu which you would have full control over.

Something like (unfortunately, this will need a little Javascript to work in IE - so it's not a *great* solution):
Code: 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "[URL unfurl="true"]http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">[/URL]
<html xmlns="[URL unfurl="true"]http://www.w3.org/1999/xhtml">[/URL]
<head>
<title>Untitled Document</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />

<style type="text/css">
	ul { 
		list-style:none; 
		margin:0;
		padding:0;
	}

	ul li ul { 
		display:none;
	}

	ul li:hover ul { 
		display:block; 
	}

	a {
		text-decoration:none;
	}

	a:hover {
		color:#f00;
	}
</style>
</head>

<body>
<ul>
<li>Choose an option
	<ul>
	<li><a href="#">&nbsp;1 </a></li>
	<li><a href="#">&nbsp;2 </a></li>
	<li><a href="#">&nbsp;3 </a></li>
	</ul>
</li>
</ul>
</body>
</html>

Foamcow Heavy Industries - Web design and ranting
Buy Languedoc wines in the UK
 
Upvote 0 Downvote
Status
Not open for further replies.

Similar threads

cae154
  • Locked
  • Question
Body of email not appearing in correct font on iPhone and iPad
Replies
1
Views
800
spamjim
spamjim
Expoverse
  • Locked
  • Helpful tip
Solution to CSS Two Level Horizonal Menu 1
Replies
1
Views
785
pmonett
pmonett
PeDa
  • Locked
  • Question
CSS two level horizontal menu
Replies
0
Views
622
PeDa
PeDa
lmcate
  • Locked
  • Question
From HTML Page open an MDB files on the server and work
Replies
0
Views
209
lmcate
lmcate
PeDa
  • Locked
  • Question
Media query: display = none/inline/block 1
Replies
1
Views
755
PeDa
PeDa

Part and Inventory Search

Sponsor

Back
Top