我正在尝试将图像与 对齐,但我无法让标题环绕图像图标。我这里有一个屏幕截图: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;}
如有任何帮助,我们将不胜感激。我以前遇到过这个,但我的技巧在这种情况下不起作用。提前谢谢你。
最佳答案
我不确定您所说的让标题环绕是什么意思...但我假设您希望图像和标题彼此相邻? vertical-align 我不认为这能很好地工作。
最好的选择是将图标作为 an 移除,并将其作为背景图像放入 CSS。这样做使您能够将其定位到像素。
它还可以让您将这两个新闻\事件图标拼接成一个文件,以提供更少的资源。
http://www.w3schools.com/css/css_image_sprites.asp
干杯! 史蒂夫
关于css - 对齐图标和 Feed 标题,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/16059341/