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


#1

<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>

#2

After class and id you are missing >

Like this:

<div id="header"> <h1>

#3

That’s what I have written.


#4

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


#5

^yours
Nope, look closely

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

^mine


#6

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


#7

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


#8
#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;
}

#9

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

What lesson is this?


#10

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.


#11

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

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

#12

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)?


#13

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!