www.webdeveloper.com
Results 1 to 3 of 3

Thread: border in css/div

  1. #1
    Join Date
    Jul 2005
    Posts
    27

    border in css/div

    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!

  2. #2
    Join Date
    Aug 2004
    Location
    Ankh-Morpork
    Posts
    19,633
    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.)
    "Please give us a simple answer, so that we don't have to think, because if we think, we might find answers that don't fit the way we want the world to be."
    ~ Terry Pratchett in Nation

    eBookworm.us

  3. #3
    Join Date
    Jul 2005
    Posts
    27
    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 Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
HTML5 Development Center



Recent Articles