user3550204
user3550204

Reputation: 15

Padding in CSS is not working

here is my code for some reason I can't get text on the picture, why is that?

HTML:

<html>
<head>
  <link rel="stylesheet" type="text/css" href="ilo.css">
  <title>Drum World</title>
</head>
<body background="back.jpg">
  <center><strong><font face="arial" size="10" color="#3366CC">Perfect Gallery     OF         Drums!    </font></strong>
  </center>
  <br>
  <br>
  <font face="Verdana" size="3" color="#006666"><strong><center>Enjoy viewing all    sorts    of drums</center></strong></font>
  </br>
  </br>
  <img src="pearl drum.jpg" border="5px">
  <p id="txt">TEXTTEXTTEXT</p>
  </img>

and here is CSS:

#txt {
  padding: 15px 35px 5px 5px;
}

Upvotes: 0

Views: 58

Answers (1)

arocketman
arocketman

Reputation: 1174

if you want "text" to be on the picture, you could give your img a relative positioning and the p an absolute positioning. Also, fix your html tags they are deprecated and messed up >.<.

http://jsfiddle.net/GNkKL/

img{
    position:relative;
}

#txt
{
padding: 15px 35px 5px 5px;
    position:absolute;
    top:0;
}

Upvotes: 1

Related Questions