Nucleus admin cssの改造

by ·

Nucleusの管理エリアのデザインは少々野暮ったい。
Nucleusを積極的に商用利用しようと思えば、こんな小さな部分も気にかかるところだ。
そこで、cssを改造し（本当は改良と書きたいが、よくなるか解らないので・・）すこし、オシャレなものを試みる。
ところがNucleusのhtmlは思いの他、汎用性の低い構造をしていた。
idのquickmenu以下に何も存在しないため、単純なフロートの解除ができない。IEなら問題ないがFirefoxでは問題だ。
少し考えて、使えそうな物ができたらアップしてみます。管理画面の基本的なhtmlソースはこんな感じ
<body>
<div class="header">
<h1></h1>
</div>
<div id="container">
<div id="content">
<div class="loginname"></div>
<table>
</table>
<h2></h2>
<table>
</table>
<h2></h2>
<ul>
<li></li>
</ul>
<div class="foot">
</div>
</div>
<div id="quickmenu">
<ul>
<li>
</li>
</ul>
<h2>
</h2>
<ul>
<li></li>
</ul>
</div>
</div>
</body>

たとえば、よくありがちなbodyにbg色を設定し、containerに違った背景色を設定、センタリングして、contentとquickmenuでダブルフロートして・・と考えると、その後のフロート解除ができない。
firefoxでは明示的に解除しないと、containerがheightで最小化してしまうために、containerの色的な役目がしない。（センタリングはOK）
ポデイショニング・・で考えても、フロートを使う限りは同じ問題にぶつかる。
さて・・どうしたものか。。。

おすすめ