border in css/div

**goodgod3rd** · 09-24-2005 09:30 AM

ok, i wanna have a border around a <div> side menu, i using css, to arange teh menu,

this is what i got so far .. messy but it works a the moment

Code:

<HTML>
<HEAD>
<STYLE TYPE="text/css">
A:link {color: #000000}
A:visited {color: #000000}
ul {
  padding: 0;
  margin: 0;
  list-style: none;
  }
 {background-color: #64b56f;}
li {
  float: ;
  position: relative;
  width: 10em;
  }
      
}
 li ul {
  background-color: #64b56f;  
  display: none;
  position: absolute; 
  top: 0em;
  left: 74;
  }

li > ul {
	top: auto;
	left: auto;
	}
li:hover ul, li.over ul{ display: block; }
</STYLE>
<script type="text/javascript"><!--//--><![CDATA[//><!--
startList = function() {
	if (document.all&&document.getElementById) {
		navRoot = document.getElementById("nav");
		for (i=0; i<navRoot.childNodes.length; i++) {
			node = navRoot.childNodes[i];
			if (node.nodeName=="LI") {
				node.onmouseover=function() {
					this.className+=" over";
				}
				node.onmouseout=function() {
					this.className=this.className.replace(" over", "");
				}
			}
		}
	}
}
window.onload=startList;

//--><!]]></script>
</HEAD> 


<body bgcolor=#7e3a6b>

<ul ID="nav">
  <li>Media~>	
   <ul>
      <li><a href="">Blackbanded        sunfish</a></li>
      <li><a href="">Shadow bass</a></li>
      <li><a href="">Ozark bass</a></li>
      <li><a href="">White crappie</a></li>
		</ul>
	</li>

  <li>Literature~> 

    <ul>
      <li><a href="">Smallmouth grunt
        </a></li>
      <li><a href="">Burrito</a></li>
      <li><a href="">Pigfish</a></li>
    </ul>
  </li>

  <li>Links~>
   <ul>
      <li><a href="">Whalesucker</a></li>
      <li><a href="">Marlinsucker</a></li>
      <li><a href="">Ceylonese remora</a></li>
      <li><a href="">Spearfish remora</a></li>
      <li><a href="">Slender suckerfish</a></li>
    </ul>
  </li>
</ul>
</BODY>
</HTML>

massy, and copyed, i ahve changed it to suit my needs, but i was wondering , how would you put a border around teh UL ? silly becasue i think i know already!

**NogDog** · 09-24-2005 09:39 AM

Add to your style block:

Code:

#nav { border: solid 2px #000000; }

Change the style, width, and color to suit your needs. (See http://www.w3.org/TR/CSS21/box.html#...yle-properties for border style possibilities.)

**goodgod3rd** · 09-24-2005 10:36 AM

Cheers!Works Like a Charm! I suppose i Should of just ADDED THE #nav stlye part of code! silly me,

my problem was trying ot put it in with the ul! i'm easily confused!

thanks again

Thread: border in css/div

Thread Tools

Display

border in css/div

Thread Information

Users Browsing this Thread

Bookmarks

Bookmarks

Posting Permissions