0

这应该很容易修复——但这不是因为 IE7，或者至少是 IE8 兼容模式。

文本“IAN MARTIN”和“wedding photojournalism”应该整齐地放在 div #lefty、#righty、#left 和 #right 内。相反，它挂在这些 div 的下半部分。

通过将 h1 和 h2 顶部位置设置在 -20px 左右可以轻松解决此问题，但随后在 IE7 中——文本从 div 顶部弹出...

该怎么办？这似乎不是 Cufon 问题 - 我将其关闭以进行测试...

jquery 动画会不会把我搞砸了？再说一次，我不这么认为，但我不是专家......

这是我的页面：http: //ianmartinphotography.com/test-site/index-cufon-02.html

以及 h1 和 h2 的 CSS：

h1 {position: absolute; letter-spacing: 4px;  color: #79868e; font-family: helvetica;   font-size: 38px;}

h2 {position: absolute; letter-spacing: 4px;  color: #969696; font-family: helvetica; font-size: 38px;}

谢谢你的想法！

4

2 回答 2

2

你的问题是你说#left要高 50px，然后在里面放一些需要 100px (38+31+31) 高度的东西，结果是内容溢出了它的父框。您需要使父级 ,#left足够高以完全容纳其子级<h2>。

但是，如果您设置#left为，height: 100px则必须将“关于”、“推荐”、...链接重新定位为再向下 50 像素，并且您必须在.field. 您可能还需要调整其他一些height值top。

您还可以修改 HTML 和 CSS，这样您就不需要绝对定位所有内容。简单地将三个<div>s 叠放在一起会给你相同的布局，同时不那么脆弱；然后一些 wrapper<div>和 margin 设置使其水平居中并从页面顶部偏移。

于 2011-02-07T03:28:59.850 回答
2

将以下 CSS 添加到 h1 和 h2：

margin:7px 0 0 0;

在这里工作得很好。

于 2011-02-07T00:01:21.103 回答