私は、純粋なCSSでubuntuロゴを作成することにより、かなり実験的な方法でCSSを学ぼうとしました（まだかなりn00bですが）。私が現在使用している HTML はhttp://pastebin.com/LuUABXFqにあり、ピクセル寸法で適切に機能していますが、これらのハードコードされた値をパーセンテージ値に置き換えて、ロゴを任意の解像度でレンダリングできるようにしたいと考えていました。適切な比率でレンダリングしてください。
このプロセスで、私は質問に困惑しました: #ubuntu-CoF-faceBackground は、#ubuntu-CoF-background 親インスタンスのサイズではなく、ビューポート サイズを使用してパーセンテージをピクセルに変換するのはなぜですか? 現在、そのコードは白い正方形の上に非常に大きな紫色の長方形をレンダリングしますが、紫色の長方形は白い正方形の半分のサイズである必要があります。(Fedora 17 x64 上の Firefox 15 および Chromium 20 でテスト済み)
この半機能コードは、私の githubにあります: https://github.com/Drknzz/HTML-Experiments/blob/master/UbuntuLogo.html ubuntu ブランドのガイドラインに準拠するテキスト。