在下面添加内容时,文本不遵循CSS格式

时间:2014-04-16 10:00:13

标签: html css

请记住我是新来的代码!

所以我有一个标题和一些文字,我想要放在我使用CSS输入的背景图像之上,因此定位是关键。

一切正常,直到我在文本下都添加了更多的HTML内容。从这一点来看,就好像文本没有拿起我的CSS指令。

HTML:

 <div id="sidemicro">
 <text class="circleheader"><h3>Special Occasion?</h3><p>Give us a call and </br> we'll see how     we can make </br> your tour  extra special!</p></br> 

这是我需要格式化的文字:

 <div id="form">
 <form action ='otterabout.php' method='POST'>
*Your Name: <input type='text' name='name'><br />
*Your Email: <input type'text' name='email'><br />
*Date of visit: <input type'date' name='date'><br />
*Time of visit: <input type'time' name='time'><br />
*Group Size: <input type'text' name='groupsize'><br />
<input type='submit' name='submit' value='Login'>
<input name='reset' type='reset' value='Reset'>
</form>
</div>
</div>

这是文本下面已停止格式化的内容。

CSS:

.circleheader {
margin-top:70%;
margin-left:15%;

}



.circletext {
text-align:center;
margin-left:35%;
}

谢谢!

1 个答案:

答案 0 :(得分:0)

这是您正在寻找的格式吗? FIDDLE

CSS

.sidemicro {
    margin-left: 10px;
    width: 600px;
    border: 1px solid black;
    background: url('https://res.cloudinary.com/roadtrippers/image/upload/v1396514626/p2nmpjpgjsm8iihdh5ip.jpg');
    background-size: 600px;
    background-repeat: no-repeat; 
}
.circleheader {
  width: 200px;
  border: 0px solid black;
  margin: 10px auto;
  color: white;
  background-color: rgba(0, 0, 0, 0.4);
  text-align: center;
}