Question

背景
对于CSS来说，我是一个真正的绿豆（就像我一周前开始的那样）并且已被指派负责构建我们公司的主页。抬头：我有0次网络开发经验，当我说0时，我的意思是一周前我认为CSS是面向对象编程的设计世界的术语而不是你真正写的东西虽然通过SO / WC3 / Google学习新东西很有趣，但我遇到了一个无法控制的问题。

问题
我们使用Joomla作为开发工具包，特别是Beez_20模板。作为问题的参考，我已经上传了一张图片here。括号显示它所在的css文件。我想将横幅（div.logoheader）放在菜单（ul.menu）的下方和下方，避免它们之间的空白区域（这是div.header的背景））。我已经看过几篇关于如何使用职位的帖子：亲戚和职位：绝对但是当我将css代码放在单独的css文件中时，我无法解决这个问题。

试错
到目前为止，我所做的是进行以下更改：

删除了最大宽度，以便菜单和背景在整个页面上延伸
把div＃行的位置：绝对;所以它始终位于页面顶部
把ul.menu位置：relative和top：35px left： - 10px把它放在div＃行的正下方（为什么这不是＆0; 0 0我不知道但是这样工作）< / LI>
放置div.logoheader位置：relative;

我尝试过在相对和绝对之间切换，但我似乎无法让它发挥作用。我总是在logoheader和ul.menu之间留下一个空白区域。我见过的提示是同时使用相对和绝对，但是当图像和元素位于不同的css文件中时，我不知道如何解决这个问题。

其他
我注意到如果我将div＃line位置从绝对位置更改为相对位置，ul.menu就会消失。然后div＃行最终位于div.logoheader的底部。如果我在personal.css和position.css中注释掉部分，那么其他元素仍然保持在相同的位置。

我认为这不是你在CSS中解决的问题，但你应该进入PHP文件，但这只是我在黑暗中刺伤。感谢我能解决这个问题的任何帮助，如果有其他需要的信息，请告诉我。

编辑：固定链接

Answer 1

尝试保持div.logoheader的相对位置，并添加bottom: 35px;。这应该推动它。这不是最好的方法，但是如果没有看到模板的实时预览，则很难给出更准确的答案。所以你的最终代码应如下所示：

div.logoheader {
    position: relative;
    bottom: 35px;
}

您可能需要根据间距更改值35。希望这有帮助

将元素放在另一个不在同一div元素内的元素旁边

1 个答案: