Want to share your CSS expertise with others? Apply to the MDN Fellowship by April 1! http://mzl.la/MDNFellowship

mozilla
Your Search Results

    -moz-orient

    概要

    Mozilla の CSS 拡張プロパティの -moz-orient は要素の 水平垂直の向き (orientation) を指定します。

    構文

    orient:  auto | horizontal | vertical

    auto
    <progress> 要素と <meter> 要素で使用可能。 horizontal に相当。
    horizontal
    要素が水平方向(デフォルトの向き)に描画される
    vertical
    要素が垂直方向に描画される

    垂直方向と水平方向のプログレスバーを表示する例を以下に示します。

    <!DOCTYPE html>
    <html>
    <head>
    <title>orient example</title>
    
    <style>
    .vert {
      -moz-orient: vertical;
      width: 16px;
      height: 150px;
    }
    </style>
    
    </head>
    
    <body>
      <p>The following progress meter is horizontal (the default):</p>
      <progress max="100" value="75"></progress>
      <p>The following progress meter is vertical:</p>
      <progress class="vert" max="100" value="75"></progress>
    </body>
    
    </html>

    表示結果

    理想的な表示結果(※画像)

    仕様

    標準仕様には含まれていません。 Mozilla の独自拡張プロパティです。

    ブラウザ実装状況

    機能 Chrome Firefox (Gecko) Internet Explorer Opera Safari
    基本サポート 未サポート 6.0 (6.0) 未サポート 未サポート 未サポート
    auto value 未サポート 21.0 (21.0) 未サポート 未サポート 未サポート
    機能 Android Firefox Mobile (Gecko) IE Mobile Opera Mobile Safari Mobile
    基本サポート 未サポート 6.0 (6.0) 未サポート 未サポート 未サポート
    auto value 未サポート 21.0 (21.0) 未サポート 未サポート 未サポート

    Gecko に関する注記

    Gecko 6.0 (Firefox 6.0 / Thunderbird 6.0 / SeaMonkey 2.3) では、垂直方向の描画を指定した <progress> 要素が水平バーの寸法でレンダリングするバグがありました。これは Gecko 7.0 (Firefox 7.0 / Thunderbird 7.0 / SeaMonkey 2.4) で修正されました。

    関連情報

    ドキュメントのタグと貢献者

    Contributors to this page: Fajrovulpo, ethertank
    最終更新者: Fajrovulpo,
    サイドバーを隠す