WeavingBird1917 WeavingBird1917 - 7 months ago 11
HTML Question

Beginners code: HTML Styling ID within ID not working



I have just started learning HTML and I am having problems with IDs/classes within IDs/classes.

So, to my knowledge, an ID is specified by a #. That would mean that if I wanted to style an ID within and ID, wouldn't that be:

#ID1 #ID2 {
...
}


Which would mean that the styling will only apply for ID2 that is inside ID1? Please correct me if I'm wrong. When I used the same principle within my (very simple beginner) code, it didn't work. Here is my code:

<!DOCTYPE html>
<html>

<head>
<title>1 May 2016</title>
<style>
#name {
color: blue;
font-family: Tahoma;
}

#parafont #1 {
font-family: Arial;
}

#parafont #2 {
font-family: Times;
}

#parafont #3 {
font-family: Courier;
}

parafont #4 {
font-family: Lucida Grande;
}

#parafont #5 {
font-family: Helvetica;
}

#test1 #6 {
color: blue;
}
</style>
</head>

<body>
<h3 id="name">Bob Bobbington</h3>
<p>1 2 3 4 5 6 7 8 9 10</p>
<p>When was this website created? Check the <b>title</b>.</p>
<h3>All animals are quite interesting...</h3>
<p id="parafont">
<span id="1">This is a test paragraph.</span>
<span id="2">Each sentence should have a different font.</span>
<span id="3">This paragraph is going to use some styling.</span>
<span id="4">Styling will change the font of each sentence.</span>
<span id="5">Let's see whether it works!</span>
</p>
<div id="test1">
<p id="6">Test</p>
</div>
</body>

</html>


All help is very much appreciated!

Answer

Change the id numbers 1 to something that starts with letters.

ID and NAME tokens must begin with a letter ([A-Za-z]) and may be followed by any number of letters, digits ([0-9]), hyphens ("-"), underscores ("_"), colons (":"), and periods (".").

Comments