css - パーセンテージ幅の絶対位置の画像を中央に配置するにはどうすればよいですか?

Question

次のcssを含む画像があります：

element.style {
    right: 50%;
    margin-right: -220px;
    top: 31%;
    width: 440px;
    position: absolute;
}

代わりに幅がパーセント (35.4%) で設定されるように変更する必要があります。私はまだそれを中央に置いて、位置を絶対に保つことができますか?

Answer 1

もちろん、上記と同じ方法が必要な場合は35.4/2 = 17.7、マージン ( DEMO )として使用してください。

element.style {
    right: 50%;
    margin-right: -17.7%;
    top: 31%;
    width: 35.4%;
    position: absolute;
}

Answer 2

を使用して水平方向に中央揃えできます

left:0; right:0; margin:auto;

したがって、マークアップとして div がある場合、css は次のようになります。

div
{
    top: 31%;
    width: 38%;
    height: 100px;
    position: absolute;
    left:0;right:0;
    margin: auto;
}

フィドル

幅を定義している限り（pxまたは％で-問題ありません）、これは機能します