从主体宽度减去元素宽度，并将元素添加为边距

Question

我在容器内有一个图像。图像应始终处于浏览器宽度（100vw）。由于我的布局是响应式的，并且容器在某一点（45em）具有固定的宽度，我不能简单地使用负边距。所以我有了一个想法，但作为一个新手，我似乎无法实现它......

这就是我想要做的事情：

• 检查身体宽度
• 检查容器宽度
• 从正文宽度
中减去元素宽度
• 将此数字除以两个
• 将此数字添加为元素的负边距

这是我到目前为止所得到的......

var bodyWidth = $('body').width(); //Check the body width
var elemWidth = $('#content').width(); //Check the container width
var margin = bodyWidth-elemWidth; //Subtract the element width from the body width

我仍然需要将数字除以2，并将此数字作为负边距添加到元素中。

非常感谢帮助。

Answer 1

你走在正确的轨道上。

var bodyWidth = $('body').width(); //Check the body width
var elemWidth = $('#content').width(); //Check the container width
var margin = bodyWidth-elemWidth; //Subtract the element width from the body width
var dividedMargin = margin / 2; // Divide the margin by 2
var negativeMargin = dividedMargin * -1; // set number to negative number
$(element).css("margin", negativeMargin); // replace element by the element name you want to apply this to.

您还可以margin，margin-left，margin-right或margin-top替换margin-bottom。