html - 在 SharePoint webpart 中的图像上放置一个按钮

Question

很难在 SharePoint Web 部件中设置按钮样式，使其位于动态设置的图像上。

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!重要；
}
#applyArea {
position:absolute!重要；
宽度:100px !重要；
左:10% 重要；
top:50% !important;
}