当前位置: 动力学知识库 > 问答 > 编程问答 >

html - How do I get my text back above and under my image?

问题描述:

Hello I'm new to html & css and I have a question. I'm using the following code to set some images with text above and under it as you can see here:

http://jsfiddle.net/thespacebean/xGqDE/

But now i'm trying to re-use that code in another box but the text isn't where it needs to be. here a use another type of box:

css:

#content{

margin: 30px 0;

background: white;

padding: 20px;

clear: both;

box-shadow: 0px 1px 1px #999;

}

html:

<div id="content">

<h2>Kleding</h2>

<div id="navbanner">

<div id="nav2">

<ul>

<li><a href="../html/kleding.html"id="Babynav">Baby</a></li>

<li><a href="../html/kleding.html"id="Peuternav">Peuter</a></li>

<li><a href="../html/kleding.html"id="Kleuternav">Kleuter</a></li>

</ul>

</div>

</div>

<div id="img">

<img src="../images/winkelwagen.jpg">

</div>

<h3>Baby</h3>

<div class="section">

<a href="../html/kleding.html"> Pika deken</a>

<a href="../html/kleding.html"><img src="../images/baby1.jpg" /></a>

€20

</div>

<div class="section">

<a href="../html/kleding.html">School outfit</a>

<a href="../html/kleding.html"><img src="../images/boy1.jpg" /></a>

€140

</div>

<div class="section">

<a href="../html/kleding.html">Bussines girl</a>

<a href="../html/kleding.html"><img src="../images/girl2.jpg" /></a>

€250

</div>

<div class="section">

<a href="../html/kleding.html">Summer</a>

<a href="../html/kleding.html"><img src="../images/girl1.jpg" /></a>

€99.99

</div>

</div>

And thats why everything is floating left. Can someone get my images and the text under and above centerd without moving the navbar and Baby title? Thanks in advance !

网友答案:

the fiddle example has

text-align: center; 

in the CSS put you don't appear to have this in your CSS so the text will be on the left;

分享给朋友:
您可能感兴趣的文章:
随机阅读: