我目前在一个盒子里有一个盒子,但它没有以文本为中心。我想将框围绕文本居中,以使框不会超出空白区域:
http://jsfiddle.net/infoed/nvVBU/(css在jdfiddle中):
<DOCTYPE! html>
<html>
<head>
<title>fumblr.</title>
<link rel="stylesheet" href="styles.css" />
<link rel="stylesheet" href="bootstrap.min.css" />
</head>
<body>
<div id="navbar">
<ul>
<li><img src="img/toplogo.png"></li>
<li> <a> Fumblr </a> </li>
</ul>
</div>
<div id="content">
<div class="box">
<img src="img/heart.svg" height="18" width="18" />
<div class="userid">DogBountyHunter27</div>
<div class="headline">Been 10 Days off bread. Want to die</div>
<p>Is there any doubt that cats are awesome? We love cats, and being Mashable and all, we know a thing or two about them. But is it even possible to put our feelings about cats into infographic form? You be the judge. Undaunted by such a Herculean task...</p>
</div>
<div class="box">
<img src="img/heart.svg" height="18" width="18" />
<div class="userid">Vader2307</div>
<div class="headline">Hilarious Link of Bill Gates Jumping over a chair</div>
<p>Type an address into your phone, and up will pop a step-by-step route from where you are to where you want to be. This is, in its way, magic. But it's magic that has, at this point, been rubbed and polished into a simple fact of life. The ease with... </p>
</div>
<div class="box">
<img src="img/heart.svg" height="18" width="18" />
<div class="userid">ShaqAttack</div>
<div class="headline">Is Insanity Wolf bad for the meme community?</div>
<p>Is there any doubt that cats are awesome? We love cats, and being Mashable and all, we know a thing or two about them. But is it even possible to put our feelings about cats into infographic form? You be the judge. Undaunted by such a Herculean task...</p>
</div>
<div class="box">
<img src="img/heart.svg" height="18" width="18" />
<div class="userid">Jimmy Two Times</div>
<div class="headline">Fax machines making a comeback in Williamsburg</div>
<p>Is there any doubt that cats are awesome? We love cats, and being Mashable and all, we know a thing or two about them. But is it even possible to put our feelings about cats into infographic form? You be the judge. Undaunted by such a Herculean task...</p>
</div>
<div class="box">
<img src="img/heart.svg" height="18" width="18" />
<div class="userid">SmoothieFanatic</div>
<div class="headline">Fifth Grader Expelled for bringing Siracha to school</div>
<p>Is there any doubt that cats are awesome? We love cats, and being Mashable and all, we know a thing or two about them. But is it even possible to put our feelings about cats into infographic form? You be the judge. Undaunted by such a Herculean task...</p>
</div>
</div>
</body>
</html>