結論から言います。

ブロック要素にwidth(100%未満)をかけていたら効くはずです。

効かない理由

  1. インライン要素にmargin: auto;をかけている

    【解決策】→インライン要素の親(ブロック要素)にtext-align: center;

  2. プロパティがdisplay: block;ではなくdisplay: inline-block;

    【解決策】→display: block;に記述し直して、widthの指定を入れる

  3. marginをとれる領域がない

    【解決策】→検証ツールで確認するか、width50%など幅の指定を入れてみる

なぜ効かないのか、以下で解説します。

ブロック要素とwidthとmarginの関係

そもそもmargin: auto;というのは、

margin-top: auto;
margin-bottom: auto;
margin-right: auto;
margin-left: auto;

の略ですよね。

上下左右autoですね。 上下左右autoなのですが、

margin-top: auto;
margin-bottom: auto;

はautoのとき0になります。

「なんでそうなるの?」

と聞かれても、こればかりはそういうものとしか答えられません。