0

我正在尝试将图像与 对齐，但我无法让标题环绕图像图标。我在这里有一个屏幕截图：http: //instagram.com/p/YNGBzrtAs8/

我的 CSS 代码一团糟，因为我一直在尝试一切，而且变得一团糟。这是当前的混乱状态：

#deck-sub .news-feed { float: left; width: 90%; padding: 5%; margin: 0 0 15px 0; }
    #deck-sub h1 { background: none; font: bold 2.0em Arial, Helvetica, sans-serif; color: #006586; margin: 0 0 -8px 0; }
    #deck-sub .news-feed h2 a {  color: #006586; text-decoration: none; font-size: 1.2em !important; margin: -33px 0 0 0;}
    #deck-sub .news-feed ul {vertical-align: middle !important; background: none; padding: 5px 0 0 0; list-style: none; }
    #deck-sub .news-feed ul li { vertical-align: middle !important; width: 100%; padding: 5px 0 5px 0; margin: 5px 0 0 0;}
    #deck-sub .news-feed ul li a  { vertical-align: middle !important; width: 100%; font: 0.8em/1.1em Arial, Helvetica, sans-serif; color: #555 !important; text-decoration: none; padding: 0px 0 0 0; margin: -5px 0 0 0; }
    #deck-sub .news-feed ul li a:hover { background: none; color: #009fc7 !important; }
    #deck-sub .new-feed ul li img {  vertical-align: middle !important;  }
    #deck-sub .sfnewsListItem { vertical-align: middle !important; background: #ccc; }
    #deck-sub .sfnewsMetaInfo { vertical-align: middle !important; padding: 0px; margin: 0px; background: #444;}

任何帮助将不胜感激。我以前遇到过这种情况，但我的技巧在这种情况下不起作用。先感谢您。

4

1 回答 1

0

我不确定您将标题环绕是什么意思...但我假设您希望图像和标题彼此相邻？垂直对齐我不相信为此工作得很好。

最好的选择是将图标作为背景删除，然后将其作为背景图像放入 CSS 中。这样做使您能够将其定位到像素。

它还可以让您将这两个新闻\事件图标拆分到一个文件中以提供更少的资源。

http://www.w3schools.com/css/css_image_sprites.asp

干杯! 史蒂夫

于 2013-04-17T13:48:10.053 回答