在 SharePoint Webpart 中的图像上放置一个按钮

Question

在 SharePoint Webpart 中设置按钮样式以使其位于动态设置的图像上时遇到困难。

HTML：

    <div id="nhaole-header-eloqua" class="imageArea">
    <img id="headerImage" src="<%=headerImageURL%>" />
    <div id="applyArea">
        <input id="applyNowBtn" type="button" value="Apply Now" class="applyButton" />
    </div></div>

CSS

        #headerImage {
        position:relative !important;
    }
    #applyArea {
        position:absolute !important;
         width: 100px !important;
         left:10% !important;
         top:50% !important;
    }

这种方法一直有效，直到您缩放窗口然后按钮不与图像保持一致。

Answer 1

我昨天可能需要更多的咖啡。

我发现我自己的问题是我需要使父 div 相对

#nhaole-header-eloqua { position:relative !important; } #applyArea { position:absolute !important; width: 100px !important; left:10% !important; top:50% !important; }