html - CSS: 純色のナビゲーション バーの透明な「セクション」

Question

CSS の問題があり、誰かが私を助けてくれることを願っています。

ナビゲーション バーをページの両側に展開しようとしていますが (単色で塗りつぶされています)、ロゴを押し込める透明なスペースがあります (下の画像を参照)。

私のページの背景は画像なので、{Logo} セルを背景色で塗りつぶすことはできません。それが役立つ場合は、Twitter Bootstrap も使用しています。

誰かがこれで私を助けてください。しばらく立ち往生しています。:S

Answer 1

私はコメントでこのようなことを言及していましたhttp://jsfiddle.net/slash197/Eh2xL/1/これは単なる概念実証であり、値とサイズを変更する必要があります。

HTML

<div class="bg">
    <div class="nav">
        <div class="logo">Logo</div>
    </div>
</div>

CSS

body, html {
    height: 100%;
}
.bg {
    background: url("http://slashwebdesign.net/green-nature-wallpaper2.jpg") no-repeat center top;
    width: 100%;
    height: 100%;
    padding: 30px 0px;
}
.nav {
    background: url("http://slashwebdesign.net/nav.png") no-repeat center top;
    height: 35px;
}
.logo {
    margin-left: 100px;
    color: #ffffff;
}