Jump to content

How do I make a submenu within a submenu?


Roxanne

Recommended Posts

I have created a horizontal menu bar for my website with drop-down submenus, but I want to change things a little bit. This is the code for my menu as it is now:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"><html><head><link href="http://fonts.googleapis.com/css?family=Pontano+Sans" rel="stylesheet" type="text/css"><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><style type="text/css"> body{    padding:0px;    background: #000000;    font-size: 12px;    color: white;    font-family: 'Pontano Sans', sans-serif;    }    #menu-bar, #menu-bar ul, #menu-bar li{font-family: 'Pontano Sans', sans-serif; font-size:18px;    text-indent:0;    padding:0;    margin:0;    }    #menu-bar li{    white-space:nowrap;    list-style: none;    position: relative;    float: left;		  /* this makes the lists to appear horizontally */    height: 50px;    text-align: center;    background-color: #000000;    line-height: 50px;    padding: 0 41px 0 0;    padding-bottom:5px;    }    #menu-bar li:last-child {padding:0; }    #menu-bar li li, #menu-bar li li:last-child{    width:100%;    text-align: left;    padding-left:25px;    padding-right:0px;		    }    #menu-bar li a{    display:block; /*added by dsonesuk */    text-decoration:none;    color: white;    }    #menu-bar li:hover{    background-color:#000000;    }    #menu-bar ul ul{    position:absolute; /*added by dsonesuk */    width:225px; /*added by dsonesuk */    top:50px;/*amended by dsonesuk */    visibility:hidden;    }    #menu-bar ul li:hover ul{    visibility:visible;    }</style><title>Columbus Dayton Springfield Ohio Roxanne Davis Photography</title><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><meta content="Roxanne Davis Photography" name="TITLE"><meta content="Roxanne Davis Photography offers professional photography services of the highest quality. Please visit my website for many examples of my work, such as wedding photos, senior pictures, pet portraits, bands which I have done photography for, scenic and wildlife photos & more, some of which are available for purchase. You will also find information on how to contact me if you wish to hire me. Based in Springfield, Ohio." name="DESCRIPTION"><meta content="reflections photography, Springfield Ohio photos photo sharing nature scenic wildlife BLOOD print gallery galleries landscape Yellowstone national park mountain waterfall animal buffalo bison coyote elk mammoth hot spring canyon river picture Kiwamu Kaede Fu-ki music photography reflection reflections photographer Roxanne Davis professional photographer photograph portfolio image wedding portrait senior nature scenic wildlife concert live show band Queensryche D'espairsRay DespairsRay BLOOD DuelJewel Soundevice Japanese rock music jrock j-rock profile jhouserock animals musician Hizumi Zero Karyu Tsukasa Geoff Tate Michael Wilton Whip Eddie Jackson Scott Rockenfield Mike Stone Hayato Shun Natsuki Yuya Baru Val" name="KEYWORDS"><meta content="roxanne@roxannedavisphotography.com" name="OWNER"><meta content="Roxanne Davis" name="AUTHOR"><meta http-equiv="EXPIRES"><meta http-equiv="CHARSET" content="ISO-8859-1"><meta http-equiv="CONTENT-LANGUAGE" content="English"><meta http-equiv="VW96.OBJECT TYPE" content="photography"><meta content="General" name="RATING"><meta content="index,follow" name="ROBOTS"><meta content="2 weeks" name="REVISIT-AFTER"><meta name="msvalidate.01" content="F77A34C56B1B9FF04A3403FA25AA137F"><meta name="verify-v1" content="LNnPNDdYip13EDc4fADK2KOeAFIBogzrFaTVxVcGF5A="><font size="2" color="#e0e0e0" face="Verdana"><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /></font></head><body bgcolor="#000000" vlink="#e0e0e0" text="#e0e0e0" link="#e0e0e0" alink="#e0e0e0"><table style="width: 100%; border-collapse: collapse" border="0" bordercolor="#000000" cellpadding="0" cellspacing="0"><tbody><tr valign="top"><td width="100%"><center><table style="border-collapse: collapse" summary="" border="0" bordercolor="#000000" cellpadding="0" cellspacing="0"><tbody><tr valign="top"><td width="800"><div><img alt="" src="/roxannedavisphotography/graphics/Roxanne_Davis_Photography_banner.jpg"></div></td><td width="200"><div style="font-size: 15px;"><br><br>Formerly<br>Reflections Photography</div></td></tr></tbody></table></centr><table style="width: 100%; border-collapse: collapse" border="0" bordercolor="#000000" cellpadding="0" cellspacing="0"><tbody><tr valign="top"><td width="100%"><center><table style="border-collapse: collapse" summary="" border="0" bordercolor="#000000" cellpadding="0" cellspacing="0"><tbody><tr valign="top"><td width="1000"><left><div id="menu-bar"><ul>  <li><a href="http://www.roxannedavisphotography.com">Home</a></li>  <li><a href="#">Portfolio</a>	  <ul>		  <li><a href="http://www.roxannedavisphotography.com/seniors.html">Seniors</a></li>		  <li><a href="http://www.roxannedavisphotography.com/wedding.html">Wedding</a></li>		  <li><a href="http://www.roxannedavisphotography.com/people_portraits.html">People & Portraits</a></li>		  <li><a href="http://www.roxannedavisphotography.com/pets.html">Pets</a></li>		  <li><a href="http://www.roxannedavisphotography.com/commercial.html">Commercial</a></li>		  <li><a href="http://www.roxannedavisphotography.com/graphics.html">Graphics</a></li></ul></li>  <li><a href="#">Bands</a>	  <ul>		  <li><a href="http://www.roxannedavisphotography.com/DespairsRay.html">D'espairsRay</a></li>		  <li><a href="http://www.roxannedavisphotography.com/Versailles.html">Versailles</a></li>		  <li><a href="http://www.roxannedavisphotography.com/Queensryche.html">Queensrÿche</a></li>		  <li><a href="http://www.roxannedavisphotography.com/Love_Said_No.html">Love Said No</a></li>		  <li><a href="http://www.roxannedavisphotography.com/Soundevice.html">Soundevice</a></li></ul></li>  <li><a href="#">Fine Art Prints</a>	  <ul>		  <li><a href="#">Scenic</a></li>		  <li><a href="#">Wildlife</a></li>		  <li><a href="#">Nature</a></li>		  <li><a href="#">Miscellaneous</a></li></ul></li>  <li><a href="#">Price Lists</a>	  <ul>		  <li><a href="http://www.roxannedavisphotography.com/price_list.html">Session & Prints Price List</a></li>		  <li><a href="http://www.roxannedavisphotography.com/wedding_price_list.html">Wedding Price List</a></li></ul></li>  <li><a href="http://roxannedavis.zenfolio.com/">Customer Order Page</a></li>  <li><a href="http://www.roxannedavisphotography.com/profile.html">About the Owner</a></li>  <li><a href="http://www.roxannedavisphotography.com/contact.html">Contact Me</a></li></ul></div></left></td></tr></tbody></table><iframe width="1000" height="667" src="http://RoxanneDavis.zenfolio.com/zf/core/embedgallery.aspx?p=21d54bef016703410e0e0e0004000000.2" frameborder="0" scrolling="no" style="background-color:#000000;"></iframe></td></tr></tbody></table><br><table style="width: 1000; border-collapse: collapse" summary="" border="0" bordercolor="#000000" cellpadding="0" cellspacing="0"><tbody><tr valign="top"><td width="350"></td><td width="300"><div><center>Website designed by Roxanne Davis<br>Copyright © 2012</center></div></td><td width="350"><center><div style="font-size: 14px; color: white;"><a href="http://www.roxannedavisphotography.com/tips.html">Tips for Choosing a Photographer</a></div></center></td></center></td></tr></tbody></table><br></td></tr></tbody></table></body></html>

You can view it on my website here:http://www.reflectio...aphy/index.html What I want to do is move the Bands menu item into the Portfolio menu item, then have the items which are currently in the Bands sections create their own drop-down menu. Like this: New%20menu%20example.jpg If anyone can tell me how to do this I would GREATLY appreciate it. I am just starting to learn the basics of CSS, so this is all new to me. Thanks!

Edited by Roxanne
  • Like 1
Link to comment
Share on other sites

First you need one extra level of nesting. Then you need to change your stylesheet to adapt to it. I can't ensure this will work perfectly, since I haven't tested it and I'm basing it on some old code I have from a previous site. It may need a few changes, so try to understand the theory and make the menu yourself.

<ul class="level0">    <li>Menu element	    <ul class="level1">		    <li>Submenu element			    <ul class="level2">				    <li>Sub-submenu element</li>				    <li>Sub-submenu element</li>			    </ul>		    </li>		    <li>Submenu element</li>	    </ul>    </li>    <li>Menu element</li></ul>

.level0 li {    position: relative;}.level1 {    display: none;    position: absolute;    left: 0;    top: 100%;}.level0 li:hover .level1 {    display: block;}.level2 {    display: none;    position: absolute;    top: 0;    left: 100%;}.level1 li:hover .level2 {    display: block;}

Link to comment
Share on other sites

You Have major validation errors, misplaced <center> and </center> tags, which should be corrected

body{		padding:0px;		background: #000000;		font-size: 12px;		color: white;		font-family: 'Pontano Sans', sans-serif;		} 		#menu-bar, #menu-bar ul, #menu-bar li{font-family: 'Pontano Sans', sans-serif; font-size:18px;		text-indent:0;		padding:0;		margin:0;		}		#menu-bar li{		white-space:nowrap;		list-style: none;		position: relative;		float: left;			  /* this makes the lists to appear horizontally */		height: 50px;		text-align: center;		background-color: #000000;		line-height: 50px;		padding: 0 22px 5px;		padding-bottom:5px;		}		#menu-bar li:last-child {padding:0; }		#menu-bar li li, #menu-bar li li:last-child{		width:100%;		text-align: left;		padding-left:25px;		padding-right:0px;						}		#menu-bar li a{		display:block; /*added by dsonesuk */		text-decoration:none;		color: white;		}		#menu-bar li:hover{		background-color:#000000;		}		#menu-bar ul ul{		position:absolute; /*added by dsonesuk */		width:225px; /*added by dsonesuk */		top:50px;/*amended by dsonesuk */		/*visibility:hidden;*/		/*background-image:/graphics/menu_background.jpg;*/ 		}		#menu-bar ul li:hover ul{		visibility:visible; background-color:#CC9999;		}		#menu-bar ul ul ul{ top:0px;} /*reset positon for all sublevels below sublevel 1*/ #menu-bar ul ul li a {display:block; width:100%; height:100%; line-height:50px; float:none; }  /*for every new sublevel add preffix ul (ul li:hover li ul = sublevel 1, ul ul li.hover li ul= sublevel 2 and so on. the .sfhover is for ie6 which should be identical to prev example but with replacment of ':hover' with '.sfhover' instead  )*/#menu-bar ul ul,#menu-bar ul li:hover li ul, /*sublevel 1*/#menu-bar ul ul li:hover li ul  /*sublevel 2*/{left:-999999em;} /*xxxxxxxxxxxxx set hover xxxxxxxxxxxxx*/#menu-bar ul li:hover,#menu-bar ul li ul{z-index:99;} /*prevents overlap from neighbouring images and borders*/ #menu-bar ul li:hover, #menu-bar ul ul li a:hover, #menu-bar ul ul li:hover {background-color:#333;} /*for every new sublevel add prefix ul (ul li:hover ul = sublevel 1, ul ul li:hover ul= sublevel 2 and so on. the .sfhover is for ie6 which should be identical to prev example but with replacment of ':hover' with '.sfhover' instead, THESE MUST BE DONE SEPARATE as below and not grouped together  )*/ /*sublevel 1*/#menu-bar ul li:hover ul{left:0px;} /*sublevel 2*/ #menu-bar ul ul li:hover ul {left:0;margin-left: 250px;} /*sublevel 3*/#menu-bar ul ul ul li:hover ul {left:0;margin-left: 250px;}  

Edited by dsonesuk
Link to comment
Share on other sites

I do greatly appreciate your help, but I just don't understand what you mean. To be honest I have almost no knowledge of CSS, though i am trying to learn, and without seeing exactly what I need to put and and exactly where it goes in my code both in the style at the top and in the html for my menu items I really can't make any use of this. The only way I would really ba able to understand it is if you copy my entire code and put all of the necessary elements in all of the places they need to go within the code.

Link to comment
Share on other sites

make backup of html and css, replace original html with below

<div id="menu-bar"> <ul>  <li><a href="http://www.roxannedavisphotography.com">Home</a></li>  <li><a href="#">Portfolio</a>		  <ul>                      <li><a href="#">Bands</a>	                     <ul>				          <li><a href="http://www.roxannedavisphotography.com/DespairsRay.html">D'espairsRay</a></li>				          <li><a href="http://www.roxannedavisphotography.com/Versailles.html">Versailles</a></li>				          <li><a href="http://www.roxannedavisphotography.com/Queensryche.html">Queensrÿche</a></li>				          <li><a href="http://www.roxannedavisphotography.com/Love_Said_No.html">Love Said No</a></li>				          <li><a href="http://www.roxannedavisphotography.com/Soundevice.html">Soundevice</a></li>                          </ul>                  </li>				  <li><a href="http://www.roxannedavisphotography.com/seniors.html">Seniors</a></li>				  <li><a href="http://www.roxannedavisphotography.com/wedding.html">Wedding</a></li>				  <li><a href="http://www.roxannedavisphotography.com/people_portraits.html">People & Portraits</a></li>				  <li><a href="http://www.roxannedavisphotography.com/pets.html">Pets</a></li>				  <li><a href="http://www.roxannedavisphotography.com/commercial.html">Commercial</a></li>				  <li><a href="http://www.roxannedavisphotography.com/graphics.html">Graphics</a></li>        </ul>  </li>  <li><a href="#">Fine Art Prints</a>		  <ul>				  <li><a href="#">Scenic</a></li>				  <li><a href="#">Wildlife</a></li>				  <li><a href="#">Nature</a></li>				  <li><a href="#">Miscellaneous</a></li>        </ul></li><li><a href="#">Price Lists</a>		  <ul>				  <li><a href="http://www.roxannedavisphotography.com/price_list.html">Session & Prints Price List</a></li>				  <li><a href="http://www.roxannedavisphotography.com/wedding_price_list.html">Wedding Price List</a></li>        </ul>  </li>  <li><a href="http://roxannedavis.zenfolio.com/">Customer Order Page</a></li>  <li><a href="http://www.roxannedavisphotography.com/profile.html">About the Owner</a></li>  <li><a href="http://www.roxannedavisphotography.com/contact.html">Contact Me</a></li>  </ul></div>

replace original css with

body{                padding:0px;                background: #000000;                font-size: 12px;                color: white;                font-family: 'Pontano Sans', sans-serif;                }                 #menu-bar, #menu-bar ul, #menu-bar li{font-family: 'Pontano Sans', sans-serif; font-size:18px;                text-indent:0;                padding:0;                margin:0;                }                #menu-bar li{                white-space:nowrap;                list-style: none;                position: relative;                float: left;                      /* this makes the lists to appear horizontally */                height: 50px;                text-align: center;                background-color: #000000;                line-height: 50px;                padding: 0 22px 5px;                padding-bottom:5px;                }                #menu-bar li:last-child {padding:0; }                #menu-bar li li, #menu-bar li li:last-child{                width:100%;                text-align: left;                padding-left:25px;                padding-right:0px;                                                }                #menu-bar li a{                display:block; /*added by dsonesuk */                text-decoration:none;                color: white;                }                #menu-bar li:hover{                background-color:#000000;                }                #menu-bar ul ul{                position:absolute; /*added by dsonesuk */                width:225px; /*added by dsonesuk */                top:50px;/*amended by dsonesuk */                /*visibility:hidden;*/                /*background-image:/graphics/menu_background.jpg;*/                 }                #menu-bar ul li:hover ul{                visibility:visible; background-color:#CC9999;                }                #menu-bar ul ul ul{ top:0px;} /*reset positon for all sublevels below sublevel 1*/ #menu-bar ul ul li a {display:block; width:100%; height:100%; line-height:50px; float:none; }  /*for every new sublevel add preffix ul (ul li:hover li ul = sublevel 1, ul ul li.hover li ul= sublevel 2 and so on. the .sfhover is for ie6 which should be identical to prev example but with replacment of ':hover' with '.sfhover' instead  )*/#menu-bar ul ul,#menu-bar ul li:hover li ul, /*sublevel 1*/#menu-bar ul ul li:hover li ul  /*sublevel 2*/{left:-999999em;} /*xxxxxxxxxxxxx set hover xxxxxxxxxxxxx*/#menu-bar ul li:hover,#menu-bar ul li ul{z-index:99;} /*prevents overlap from neighbouring images and borders*/ #menu-bar ul li:hover, #menu-bar ul ul li a:hover, #menu-bar ul ul li:hover {background-color:#333;} /*for every new sublevel add prefix ul (ul li:hover ul = sublevel 1, ul ul li:hover ul= sublevel 2 and so on. the .sfhover is for ie6 which should be identical to prev example but with replacment of ':hover' with '.sfhover' instead, THESE MUST BE DONE SEPARATE as below and not grouped together  )*/ /*sublevel 1*/#menu-bar ul li:hover ul{left:0px;} /*sublevel 2*/ #menu-bar ul ul li:hover ul {left:0;margin-left: 250px;} /*sublevel 3*/#menu-bar ul ul ul li:hover ul {left:0;margin-left: 250px;}  

Here ends the difficult, copy and paste lesson for today.

  • Like 1
Link to comment
Share on other sites

Thank you. I do greatly appreciate your help. I had to do a few adjustments to make it display the way I wanted it to, but it is working now. You should know however that your original comment was very unclear as to what I needed to do, and it was because you didn't fully explain what you meant for me to do. My daughter is quite familiar with CSS, and I had her take a look at it to see if she could explain it to me and even she didn't understand what you meant. Neither of us realized that you meant for me to copy all of the CSS you added & paste it there just exactly as you had it written. Perhaps that is due to the fact that the formatting of it is different than the rest of the CSS.

Link to comment
Share on other sites

  • 2 weeks later...

My menu is working, but there is a problem with my main menu. All of my main menu items have the proper padding except the last item, which has no padding. The easiest way to see this is when you mouse-over it, because it is set to change color on mouse-over. I have no idea what the problem is. Here is my code:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"><html><head><link href="http://fonts.googleapis.com/css?family=Pontano+Sans" rel="stylesheet" type="text/css"><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><style type="text/css">body{				padding:0px;				background: #000000;				font-size: 12px;				color: white;				font-family: 'Pontano Sans', sans-serif;				} 				#menu-bar, #menu-bar ul, #menu-bar li{font-family: 'Pontano Sans', sans-serif; font-size:18px;				text-indent:0;				padding:0;				margin:0;				}				#menu-bar li{				white-space:nowrap;				list-style: none;				position: relative;				float: left;					  /* this makes the lists to appear horizontally */				height: 50px;				text-align: center;				background-color: #000000;				line-height: 50px;				padding: 0 25px 5px 25px;				}				#menu-bar li:last-child {padding:0; }				#menu-bar li li, #menu-bar li li:last-child{				width:100%;				text-align: left;				padding-left:25px;				padding-right:0px;				}				#menu-bar li a{				display:block; /*added by dsonesuk */				text-decoration:none;				color: white;				}				#menu-bar li:hover{				background-color:#000000;				}				#menu-bar ul ul{				position:absolute; /*added by dsonesuk */				width:225px; /*added by dsonesuk */				top:50px;/*amended by dsonesuk */				visibility:hidden;				}				#menu-bar ul li:hover ul{				visibility:visible; background-color:#000000;				}			  #menu-bar ul ul ul{ top:0px;} /*reset position for all sublevels below sublevel 1*/ #menu-bar ul ul li a {display:block; width:100%; height:100%; line-height:50px; float:none; }  /*for every new sublevel add preffix ul (ul li:hover li ul = sublevel 1, ul ul li.hover li ul= sublevel 2 and so on. the .sfhover is for ie6 which should be identical to prev example but with replacement of ':hover' with '.sfhover' instead  )*/#menu-bar ul ul,#menu-bar ul li:hover li ul, /*sublevel 1*/#menu-bar ul ul li:hover li ul  /*sublevel 2*/{left:-999999em;} /*xxxxxxxxxxxxx set hover xxxxxxxxxxxxx*/#menu-bar ul li:hover,#menu-bar ul li ul{z-index:99;} /*prevents overlap from neighbouring images and borders*/ #menu-bar ul li:hover, #menu-bar ul ul li a:hover, #menu-bar ul ul li:hover {background-color:#979797;} /*for every new sublevel add prefix ul (ul li:hover ul = sublevel 1, ul ul li:hover ul= sublevel 2 and so on. the .sfhover is for ie6 which should be identical to prev example but with replacement of ':hover' with '.sfhover' instead, THESE MUST BE DONE SEPARATE as below and not grouped together  )*/ /*sublevel 1*/#menu-bar ul li:hover ul{left:0px;} /*sublevel 2*/ #menu-bar ul ul li:hover ul {left:0;margin-left: 250px;} /*sublevel 3*/#menu-bar ul ul ul li:hover ul {left:0;margin-left: 250px;}</style><title>Columbus Dayton Springfield Ohio Roxanne Davis Photography</title><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><meta content="Roxanne Davis Photography" name="TITLE"><meta content="Roxanne Davis Photography offers professional photography services of the highest quality. Please visit my website for many examples of my work, such as wedding photos, senior pictures, pet portraits, bands which I have done photography for, scenic and wildlife photos & more, some of which are available for purchase. You will also find information on how to contact me if you wish to hire me. Based in Springfield, Ohio." name="DESCRIPTION"><meta content="reflections photography, Springfield Ohio photos photo sharing nature scenic wildlife BLOOD print gallery galleries landscape Yellowstone national park mountain waterfall animal buffalo bison coyote elk mammoth hot spring canyon river picture Kiwamu Kaede Fu-ki music photography reflection reflections photographer Roxanne Davis professional photographer photograph portfolio image wedding portrait senior nature scenic wildlife concert live show band Queensryche D'espairsRay DespairsRay BLOOD DuelJewel Soundevice Japanese rock music jrock j-rock profile jhouserock animals musician Hizumi Zero Karyu Tsukasa Geoff Tate Michael Wilton Whip Eddie Jackson Scott Rockenfield Mike Stone Hayato Shun Natsuki Yuya Baru Val" name="KEYWORDS"><meta content="roxanne@roxannedavisphotography.com" name="OWNER"><meta content="Roxanne Davis" name="AUTHOR"><meta http-equiv="EXPIRES"><meta http-equiv="CHARSET" content="ISO-8859-1"><meta http-equiv="CONTENT-LANGUAGE" content="English"><meta http-equiv="VW96.OBJECT TYPE" content="photography"><meta content="General" name="RATING"><meta content="index,follow" name="ROBOTS"><meta content="2 weeks" name="REVISIT-AFTER"><meta name="msvalidate.01" content="F77A34C56B1B9FF04A3403FA25AA137F"><meta name="verify-v1" content="LNnPNDdYip13EDc4fADK2KOeAFIBogzrFaTVxVcGF5A="><font size="2" color="#e0e0e0" face="Verdana"><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /></font></head><body bgcolor="#000000" vlink="#e0e0e0" text="#e0e0e0" link="#e0e0e0" alink="#e0e0e0"><table style="width: 100%; border-collapse: collapse" border="0" bordercolor="#000000" cellpadding="0" cellspacing="0"><tbody><tr valign="top"><td width="100%"><center><table style="border-collapse: collapse" summary="" border="0" bordercolor="#000000" cellpadding="0" cellspacing="0"><tbody><tr valign="top"><td width="800"><div><img alt="" src="/roxannedavisphotography/graphics/Roxanne_Davis_Photography_banner.jpg"></div></td><td width="200"><div style="font-size: 15px;"><br><br>Formerly<br>Reflections Photography</div></td></tr></tbody></table></centr><table style="width: 100%; border-collapse: collapse" border="0" bordercolor="#000000" cellpadding="0" cellspacing="0"><tbody><tr valign="top"><td width="100%"><center><table style="border-collapse: collapse" summary="" border="0" bordercolor="#000000" cellpadding="0" cellspacing="0"><tbody><tr valign="top"><td width="1000"><left><div id="menu-bar"><ul>  <li><a href="http://www.roxannedavisphotography.com">Home</a></li>  <li><a href="#">Portfolio</a>				  <ul>					<li><a href="#">Bands</a>							 <ul>										  <li><a href="http://www.roxannedavisphotography.com/DespairsRay.html">D'espairsRay</a></li>										  <li><a href="http://www.roxannedavisphotography.com/Versailles.html">Versailles</a></li>										  <li><a href="http://www.roxannedavisphotography.com/Queensryche.html">Queensrÿche</a></li>										  <li><a href="http://www.roxannedavisphotography.com/Love_Said_No.html">Love Said No</a></li>										  <li><a href="http://www.roxannedavisphotography.com/Soundevice.html">Soundevice</a></li>						  </ul>				  </li>								  <li><a href="http://www.roxannedavisphotography.com/seniors.html">Seniors</a></li>								  <li><a href="http://www.roxannedavisphotography.com/wedding.html">Wedding</a></li>								  <li><a href="http://www.roxannedavisphotography.com/people_portraits.html">People & Portraits</a></li>								  <li><a href="http://www.roxannedavisphotography.com/pets.html">Pets</a></li>								  <li><a href="http://www.roxannedavisphotography.com/commercial.html">Commercial</a></li>								  <li><a href="http://www.roxannedavisphotography.com/graphics.html">Graphics</a></li>		</ul>  </li>  <li><a href="#">Fine Art Prints</a>				  <ul>								  <li><a href="http://www.roxannedavisphotography.com/scenic.html">Scenic</a></li>								  <li><a href="http://www.roxannedavisphotography.com/wildlife.html">Wildlife</a></li>								  <li><a href="http://www.roxannedavisphotography.com/text/nature.html">Nature</a></li>								  <li><a href="http://www.roxannedavisphotography.com/miscellaneous.html">Miscellaneous</a></li>		</ul></li><li><a href="#">Price Lists</a>				  <ul>								  <li><a href="http://www.roxannedavisphotography.com/price_list.html">Session & Prints Price List</a></li>								  <li><a href="http://www.roxannedavisphotography.com/wedding_price_list.html">Wedding Price List</a></li>		</ul>  </li>  <li><a href="http://roxannedavis.zenfolio.com/">Customer Order Page</a></li>  <li><a href="http://www.roxannedavisphotography.com/profile.html">About the Owner</a></li>  <li><a href="http://www.roxannedavisphotography.com/contact.html">Contact Me</a></li>  </ul></div></left></td></tr></tbody></table><iframe width="1000" height="667" src="http://RoxanneDavis.zenfolio.com/zf/core/embedgallery.aspx?p=21d54bef016703410e0e0e0004000000.2" frameborder="0" scrolling="no" style="background-color:#000000;"></iframe></td></tr></tbody></table><br><table style="width: 1000; border-collapse: collapse" summary="" border="0" bordercolor="#000000" cellpadding="0" cellspacing="0"><tbody><tr valign="top"><td width="350"></td><td width="300"><div><center>Website designed by Roxanne Davis<br>Copyright © 2012</center></div></td><td width="350"><center><div style="font-size: 14px; color: white;"><a href="http://www.roxannedavisphotography.com/tips.html">Tips for Choosing a Photographer</a></div></center></td></center></td></tr></tbody></table><br></td></tr></tbody></table></body></html>

Here is a link to my test page where you can see the problem:http://www.reflectio...phy/test_2.html I have tried making the padding smaller to see if that would fix it, but it didn't, it just changed the padding on all of the other menu items.

Edited by Roxanne
Link to comment
Share on other sites

  • 2 weeks later...

I am trying to understand what all is happening over here. Looks like interesting stuff to learn!

Link to comment
Share on other sites

That did it, thank you so much!
Hi Roxanne, Greetings to you Mate! Trust me… “dsonesuk” and “Ingolme” are just more than Genius! I consider them as my Mentors along with "JustSomeGuy" and few other members. Due to circumstances I am not frequent into this forum.
Link to comment
Share on other sites

Have you completed the CSS tutorials?
Hi niche,I don't know how to answer your question. But however, let me try to answer it. Certain things I know and certain things I don't know. Which-ever I know, I am pretty good into it and which-ever I don't know, I try to learn and understand it.I have NO IDEA how to complete the CSS tutorials. I would be very glad if you could help me to complete the CSS tutorials. Maybe you can tell me something to DO / Create and accordingly I will do and submit the same. Maybe you can open a New Thread as "Join to Complete CSS Tutorials" in "CSS" segment.Thank you.
Link to comment
Share on other sites

Best yet, what do you need to create or want to learn?

Link to comment
Share on other sites

Best yet, what do you need to create or want to learn?
Hi niche,You are a Professor (Instructor) and I am your Pupil (Learner). You need to tell me what you want me to create or want to learn? Just consider that I have joined your institution to Complete the CSS tutorials. Maybe let's not discuss here. Let's open a New Thread. I will do it on your behalf into "CSS" segment.
Link to comment
Share on other sites

Thanks, but no thanks. Learning on every forum is mostly self-directed of necessity.

Link to comment
Share on other sites

Here's the minutes of a recent attempted joint venture: http://w3schools.invisionzone.com/index.php?showtopic=43669 The best advice is just start posting code and asking questions. You'll get plenty of help. As you noted, there be genius here! Generally, the more specific and researched the question the faster the help. That's how forums work.

Link to comment
Share on other sites

The best advice is just start posting code and asking questions. You'll get plenty of help.
Hi niche,I know members get plenty of help here. I am aware about that. And yes, I have been doing your advice from past several years and hence I am already aware about your advice. But however, thank you for your advice. Not a big deal...
Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
×
×
  • Create New...