Welcome to Talking HTML, an audio/video internet thing for web developers who are just starting out

Code will be attached to show notes for you to reference as you listen, or go ahead and copy it to try it out for yourself.

 

Start out with html

 Use an Unordered list

 Nest your lists

Display: none; hides the dropdown menu

display: block; makes the menu appear when attached using :hover to a

 

If you enjoy listening please share it with your friends and Please go to iTunes and Stitcher to rate the show! Ratings get listeners!!

If you leave a good comment it could end up on the front page of the site!

 

http://www.Webdevpod.com for all the content and links

@TNPWDesign

@tommnorman

DreamHost promo code - tnpw

 

#nav ul li{
position: relative;
color: white;
background: #113e63;
display: block;
width: 150px;
position: relative;
list-style-type: none;
float: left;
padding: 0px;
margin: 0 3px 0 0;
height: 40px;
border: 0px solid #ffbf00;
-webkit-border-radius: 10px 10px 0 0;
-moz-border-radius: 10px 10px 0 0;
border-radius: 10px 10px 0 0;
}

#nav ul li a {
display: block;
text-decoration: none;
color: white;
font-size: 1.4em;
line-height: 40px;
text-align: center;
}

#nav ul li:hover,
#nav ul li:focus,
#nav ul li#current {
background: #c1c4c4;
line-height: 40px;
}

#nav ul li a:hover,
#nav ul li a:focus,
#nav ul li#current a {
color: #000;
}

ul#pod-links {
position: absolute;
display: none;
top:100%;
left:0;
}

ul#pod-links li {
color: white;
background: #113e63;
display: block;
width: 150px;
position: relative;
list-style-type: none;
float: left;
padding: 0px;
margin: 0 3px 0 0;
height: 40px;
border: 0px solid #ffbf00;
border-top: 5px solid #fff;
}

ul#pod-links li a {
display: block;
text-decoration: none;
color: white;
font-size: 1.4em;
line-height: 40px;
text-align: center;
}

ul#pod-links li:hover,
ul#pod-links li:focus,
ul#pod-links li#current {
background: #c1c4c4;
line-height: 40px;
}

#nav ul ul#pod-links li a:hover,
#nav ul ul#pod-links li a:focus,
#nav ul ul#pod-links li#current a {
color: #000;
}

#nav ul li:hover > ul#pod-links {
display: block;
}

 

Home
Portfolio
Hire Me
The Podcasts

Talking 1265
Talking HTML