开发者

How do I make elements flow horizontally instead of vertically?

I have a link after an image in my xhtml. The browser automatically puts a return character after the image so that the link is below the image. I want the link to be beside the image. How do 开发者_高级运维I modify the CSS/XHTML for this?

PHP generates it like this(example code)

  echo "<img class = \"c\" src=\"http:\/\/www.facebook.com\/favicon.ico\" alt=\"\"\/>";
  echo "<a name = \"a1\" class = \"b\" href = \"$ass_array[url]\">$ass_array[name]</a>";

CSS

img.c
  {
  display:??;
  }

a.b
  {
  color:#000088;
  padding-top:2px;
  padding-bottom:2px; 
  display:block;
  width:100%;
  border-bottom:1px solid #cccccc;
  }


See: http://jsfiddle.net/thirtydot/vgnAa/

CSS:

.c {
    display: block;
    float: left;
    margin-top: 4px;
    margin-right: 4px;
}
.b {
    color:#000088;
    padding-top:2px;
    padding-bottom:2px; 
    display:block;
    border-bottom:1px solid #cccccc;
    overflow: hidden;
}


Either float: left, float: right depending which side you want the link to be. Apply that to both, and make sure to have a clear div after.

This way you can still have that display:block on .b.


"float:left;" for both elements will work

0

上一篇:

下一篇:

精彩评论

暂无评论...
验证码 换一张
取 消

最新问答

问答排行榜