将鼠标悬停在绝对位置的缩略图中（IE）

我创建了一个缩略图图片网格，当它悬停时，图片消失了一个块的颜色，并显示图片的标题。但在Internet Explorer中，而不是出现在其设置的缩略图空间中的图片和文本，它们都在左边角落。将鼠标悬停在绝对位置的缩略图中（IE）

图片和标题存储在box/category-widecreen div中，这是一个WordPress的动态代码。

任何想法？

#page-wrap {width: 1060px; padding-bottom: 40px;} 
.box { margin: 20px; float: left; } 

.category-widescreen { width: 400px; height: 229px; background: #FF0000; } 
.category-widescreen a{text-decoration: none;} 
.category-widescreen h1{font-size: 30px; color: #FFF; line-height: 34px;} 
.category-widescreen h2{font-size: 26px; color: #FFF; line-height: 30px;} 

.title{position:absolute; top:14px; left:14px; z-index: 0; padding-right: 14px;} 

.category-widescreen img { max-width: 400px; max-height: 229px; float: right; padding: 0 0 2px 10px; z-index:1; position:relative;}

谢谢任何帮助！

来源

2011-11-07 amy123

心灵至少给予基本的HTML结构？ ..什么是最好的，实际示例页面（http://www.jsfiddle.net） – Joonas

http://www.amythornley.co.uk/blog/（： – amy123

太模糊了！正如其他人所建议的，给出基本的html结构。但是，一些观察：
是否使用的字体大小有点太大（30px和26px）？
title {position：absolute; ...} ....确保父母的位置是样式的：相对的，否则它会变成一团糟;
浮动怎么样？你是否确定事情正朝着正确的方向发展？

希望已经帮助或至少让你的眼睛睁得大大的！哈哈哈...

来源

2011-11-07 13:48:05

Thankyou位置：相对工作在我的盒子elelement。有些照片仍然不符合保证金要求，但我现在会研究这一点！ – amy123

您需要设置position:relative到您的帖子，以便绝对定位的元素知道在哪里跟随。

试试这个：

.post { 
position:relative; 
}

来源

2011-11-07 13:55:49

将鼠标悬停在绝对位置的缩略图中（IE）

回答

相关问题