Question

我希望2012年位于第一张地图的左侧（几乎就是它），而2010年则位于第二张地图的左侧。我无法发布截图，因为我是新用户，但它们位于页面的左侧和右侧。

这是我的代码：

<b>2012<b>
<div id="map_canvas2" style="width:25%; height:25%"></div>
<b>2010<b>
<div id="map_canvas" style="width:25%; height:25%"></div>

搜索后我发现你必须用CSS做，但是怎么做？我觉得如果我在CSS中将某些内容设置为左侧，则所有文本都会显示在左侧。

提前致谢！

Answer 1

将它放在css代码中。

<style type="text/css">
   b,div{float:left;}
   .cls{clear:both;}
</style>

HTML code：

<b>2012</b>
<div id="map_canvas2" style="width:25%; height:25%">div 1</div>
    <br class="cls"/>
<b>2010</b>
    <div id="map_canvas" style="width:25%; height:25%"> div 2</div>    <br class="cls"/>

这应该这样做。

Answer 2

我认为你应该像这样编码： -

<强> HTML

<div id="map_canvas"><b>2012<b></div>
<div id="map_canvas2"><b>2010<b></div>

<强> CSS

#map_canvas {
float:left;
background:red;
width:300px;
height:200px;
}

#map_canvas2 {
float:right;
background:green;
width:300px;
height:200px;
}

请参阅演示： - http://jsfiddle.net/3XBNa/1/

在div元素上对齐文本

2 个答案: