Question

我正在尝试将图像与a对齐，而我无法获得包围图像图标的标题。我在这里有一个屏幕上限：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;}

非常感谢任何帮助。我之前遇到过这种情况，但在这种情况下我的伎俩并不奏效。提前谢谢。

Answer 1

我不确定你的意思是让标题环绕......但我想你想让图像和标题相互靠近？ vertical-align我不相信这很棒。

最好的选择是删除图标，而不是将其作为背景图像放入CSS中。这样做可以让你将它定位到像素。

它还允许您将这两个新闻\事件图标精简到一个文件中以提供更少的资源。

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

干杯！史蒂夫

对齐图标和Feed标题

1 个答案: