0

我有这个 DIV：

#bar {
  margin: 5px 0px 10px 0px;
  height: 25px;
  background:#c0c0c0;
  color: #E0E0E0;
  border: 2px solid #444444;
  background: #333333;
  padding: 5px;
}

而这个 iframe：

<div id="bar">
<iframe src="myvotes.php?u=<? echo $_GET['u']; ?>" width="100%" height="28px" scrolling="no" frameborder="0"></iframe>
</div>

在 iframe (myvotes.php) 内有 5 个 16 x 16 的小图像，每个图像后跟一些文本。我试图让图像和文本在 [div id="bar"] 中垂直对齐但没有成功。

首先，我的 iframe 应该有多高。我已经尝试了从 16px 到 35px 的所有内容。我尝试添加填充和边距的各种组合以使其居中，但没有运气，

同样，我没有提供链接，但任何帮助都值得赞赏。这些小事情太烦人了，浪费了我没有的大量时间。

4

4 回答 4

0

不确定您的问题，但我会尝试为您提供一个解决方案，您可以在其中垂直对齐 16x16 图像。

在您的 myvotes.php 中创建一个 div 并将您的图像保存在其中。一个例子。

<div id="someone" style="width:16px;">
   <img src=".........."/>
   <img src=".........."/>
   <img src=".........."/>
   <img src=".........."/>
   <img src=".........."/>
   <img src=".........."/>
</div>

这会将您的图像置于垂直列中。

现在你的主要 div 和 iframe

<div id="bar">
<iframe src="myvotes.php?u=<? echo $_GET['u']; ?>" width="100%" height="80px" scrolling="no" frameborder="0"></iframe>
</div>

我不确定，但这是你的答案。无论如何希望它有所帮助。

于 2010-07-22T02:27:10.493 回答
0

如果这会回答您的问题，我不是 100% 肯定，因为我有点不确定您要做什么，但是垂直对齐图像的一种简单方法是在它们上设置 vertical-align 属性：

#bar img {
    vertical-align: middle; 
}

如果这不起作用，您还可以尝试将 line-height 设置为与 div 相同的高度：

#bar {
    height: 28px;
    line-height: 28px;
}

并且完全不相关，您在本网站上缩进 4 个空格的任何文本都会赋予它代码样式格式。

于 2010-07-22T01:40:02.293 回答
0

我不知道我做了什么，但我只是弄乱了所有的价值观并得到了它，但我不应该这样做。我不知道其他程序员是如何处理这种事情的，但是在这个项目之后，我只是把它扔进去了。太多小时的事情本来应该只需要几分钟，但最终却需要几个小时。

好吧，我的咆哮已经够多了，感谢您的建议，我在发布此内容时找不到代码按钮，因此不得不即兴发挥。

垂直对齐也是自我解释的，但它不像我预期的那样工作。我想我记得在某处读过，图像周围总是有空间。没有把握。

于 2010-07-22T02:09:15.280 回答
0

我认为您需要指定垂直对齐的含义。但这里要知道的重要一点是 iframe 是棘手的野兽。本质上，它们是网页中的网页，如果没有与该“内部”页面相关联的样式，则所有内容都与左上角对齐。

您可能想要做的是让 myvotes.php 回显您想要包装在 div 中的内容，该 div 应用了适当的 css。我相信 myvotes.php 还必须拥有自己的 css，这是 div 从中获取样式的地方。如果您可以为 myvotes.php 提供一些源代码，我可能会为您提供进一步的帮助。

于 2010-07-22T02:09:58.553 回答