Question

I cant find the text in browser when i use this code, caan someone please help me out telling me my errors i cant seem to find the problem its all simple html and css

<html>
    <head>  <title>Header example</title>

    </head>
<style>
body {background: green; 
    height:100%;
    margin:0; padding:0;
    }

#header1 {z-index:2; 
    position:fixed; top:0; left:0; 
    width:100%; height:30%;
    }

p1 {background:#FFFF00;
    position:absolute; top: 80%; left: 5%; 
    height: 40%; width: 100%;
}
</style>
</head>

<body>
<body oncontextmenu="return false;">


        <div id="header1"> <img src="Head_img.gif" width="100%" height="100%" />
        </div>

    <div id="p1">
<p Text text text text text text text textText text text text text text text text Text text text text text text text text </p>
    </div>
</body>

</html>
Was it helpful?

Solution

Five major issues:

  • You have no <!DOCTYPE>
  • You have two <body> opening tags.
  • You have two </head> closing tags.
  • Your <style> block is sort of in a <head> tag.
  • You never properly open your <p> tag.

One minor issue:

  • Your <img /> tag should have an alt attribute that holds some text describing what's in that image.

This code should work:

<!DOCTYPE html>

<html>
<head>
  <title>Header example</title>
  <style type="text/css">
body {background: green; 
    height:100%;
    margin:0; padding:0;
    }
  #header1 {z-index:2; 
    position:fixed; top:0; left:0; 
    width:100%; height:30%;
    }
  p1 {background:#FFFF00;
    position:absolute; top: 80%; left: 5%; 
    height: 40%; width: 100%;
  }
  </style>
</head>

<body>
  <div id="header1"><img src="Head_img.gif" width="100%" height="100%"></div>

  <div id="p1">
    <p>Text text text text text text text textText text text text text text text text Text text text text text text text text</p>
  </div>
</body>
</html>

OTHER TIPS

<p> Text text text text text text text textText text text text text text text text Text text text text text text text text </p>

not

<p Text text text text text text text textText text text text text text text text Text text text text text text text text </p>

Well your <p> element does not have any end >...

<p Text

Should be

<p> Text
Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top