Question

我有一点问题我试图在两个div之间放置一个图像但是当我做table2[(table2['parameter'] = parameter) & (table2['value'] = value)]它什么也没做，所以我做margin: 0 auto;然后它弄乱了我的div向右和我的底部的滑块。

site messed up

当我删除display:block;时，它不会搞砸滑块停留并且div不会下降，当我添加它时，它会执行您在上面看到的内容。所以然后我试图向左浮动，但它修复它然后它图像向左。所以然后我尝试了margin-left：50％然后它向右移动所以我添加display：block并且它再次混乱。我在其中一篇文章中读到他们做过display:block，但这也没有用。这是我的代码：

HTML：

overflow:hidden;

的CSS：

    <div id="siteheader">
            <!-- this is the first div that is to the left -->
            <div id="sitetitle" class="left">
                ...
            </div>
             <!-- this is the image i need in the middle -->
               <img id="headerlogo" src="http://barkitv.com/barki/wp-content/uploads/2016/01/new-logo-copy.png" height="40" width="40">

            <!-- this is the second div that is to the right -->
            <div class="signinmenu">
                <ul>...</ul></div>


            </div>
        </div>

要更好地查看并更好地编辑，请访问barkitv.com/barki

（我在检查元素中没有这个所以我没有代码）

主要问题是/* this class was applied to the div with the id of sitetitle */ .left { float: left; } #siteheader > div.signinmenu { width: fit-content; float: right; height: 30px; padding-right: 20px; padding-top: 20px; } #siteheader { height: 85px; width: 100%; background: #8b4517; }当我将它添加到ID为headerlogo的图像时，它会从标题栏内部向下移动signinmenu，我希望它保持不变并且还会向下移动滑块。

谢谢

Answer 1

将你的img包裹在div中，然后将div放在你的另外两个之间。

调整HTML：

<div id="imgDiv">
    <img id="headerlogo" src="http://barkitv.com/barki/wp-content/uploads/2016/01/new-logo-copy.png" height="40" width="40">
</div>

添加到CSS：

#imgDiv {
  position: absolute;
  top: 22.5px;
  left: calc(50vw - 20px);
  width: 40px;
}

将图像定位在两个div的中间--css

1 个答案: