7. Headings, paragraphs, and lists. paragraph tags not producing text

<PLEASE USE THE FOLLOWING TEMPLATE TO HELP YOU CREATE A GREAT POST!>

<Below this line, add a link to the EXACT exercise that you are stuck at.>

<In what way does your code behave incorrectly? Include ALL error messages.>
I added p tags but text will not appear.

``` <div id="header"

Tony Garcia

<div class="left"

2009-2011

<div class="right" <div id="footer"
<do not remove the three backticks above>

After class and id you are missing >

Like this:

<div id="header"> <h1>
1 Like

That’s what I have written.

You haven’t closed any of your opening div tags at all…

1 Like

^yours
Nope, look closely

 <div class="left"> <p>2009-2011</p></div>

^mine

2 Likes

Thanks guys! Another thing I noticed is the text in my left and right are showing up underneath the header.

You need to show me your CSS then only I can help you regarding that

#header  {
    border-radius: 5px;
    background-color: #808080;
    height: 20%;
    width: 100%;
    position:fixed;
    z-index:1;
}

.left  {
    border-radius: 5px;
    background-color: #808000;
    height: 90%;
    width: 40%;
    float:left;
}

.right  {
    border-radius: 5px;
    background-color: #808000;
    height: 90%;
    width: 40%;
    float:right;
}

#footer  {
    border-radius: 5px;
    background-color: #808080;
    height: 20%;
    width: 100%;
    clear:both;
}

What do you mean underneath the header?
The left and right div’s are under the header.

What lesson is this?

Build a Resume, 7 Headings, paragraphs, and lists. I am adding the paragraph to the left and list to the right. The text is not visible until I scroll down. Then I can see the text because the header moves slightly down the page.

You can push your .left and .right down, using margin:

.left, .right {
  margin-top: 20%;
}
1 Like

Tried it. Shrinks left but when the page is scrolled to the top the text is blocked by the header. Also, I tried background-size attribute (is attribute the right word)?

I got .left and .right to push down with margin-top:10%.

Here is what my code looks like:

#header  {
    border-radius: 5px;
    background-color: #808080;
    height: 20%;
    width: 100%;
    position:fixed;
    z-index:1;
}

.left  {
    border-radius: 5px;
    background-color: #808000;
    height: 90%;
    background-size: contain;
    float:left;
    margin-top:10%;

}

.right  {
    border-radius: 5px;
    background-color: #808000;
    height: 90%;
    width: 90%;
    float:right;
    margin-top:10%;
    
}

#footer  {
    border-radius: 5px;
    background-color: #808080;
    height: 20%;
    width: 100%;
    clear:both;
}

Thanks stetim91!