Databases
StackOverflow2013
Postsdbo
POCSS: header bg image position
Body
 

Note that there are some explanatory texts on larger screens.

plurals
  1. POCSS: header bg image position
    text
    copied!<p>i'm currenty developing a website, and i have a problem on the header background, so the header that i'm making is:</p> <p><a href="http://i.imgur.com/h1JLm9A.jpg" rel="nofollow">http://i.imgur.com/h1JLm9A.jpg</a></p> <p>and currently i have this:</p> <p><a href="http://i.imgur.com/LgF6HXm.jpg" rel="nofollow">http://i.imgur.com/LgF6HXm.jpg</a></p> <p>I'm trying to put a background image on the header, but to have the correct positioning of the image, it can not be in the header, because the image is also showing out of the header. how can i do this? i try to use z-index but don't works.</p> <p>html:</p> <pre><code>&lt;div id="container"&gt; &lt;div id="header"&gt; &lt;div id="logo"&gt; &lt;a href="http://localhost/Yazigi/"&gt;&lt;img src="http://localhost/Yazigi/wp-content/uploads/2013/01/logo.png" width="155" height="85" alt="Yazigi – Araçatuba"&gt;&lt;/a&gt; &lt;/div&gt; &lt;span class="site-description ir"&gt;Você cidadão do mundo&lt;/span&gt; &lt;form method="get" id="searchform" class="search" action="#"&gt; &lt;input type="text" class="search_input" name="s" id="s" placeholder="Procure aqui"&gt; &lt;input type="submit" class="search_bt ir" name="submit" id="searchsubmit" value=""&gt; &lt;/form&gt; &lt;ul class="menu l_tinynav1"&gt; &lt;li class="current_page_item"&gt;&lt;a href="http://localhost/" title="Início"&gt;Início&lt;/a&gt;&lt;/li&gt; &lt;li class="page_item page-item-2"&gt;&lt;a href="http://localhost/Yazigi/?page_id=2"&gt;Página de Exemplo&lt;/a&gt;&lt;/li&gt; &lt;/ul&gt; &lt;/div&gt; &lt;/div&gt; </code></pre> <p>CSS:</p> <pre><code>#container { margin: 0 auto; max-width: 960px; padding: 0px 25px; } #header { height: 232px; background: url(images/topbg.jpg); margin: 0; } </code></pre>
 

Querying!

 
Guidance
An individual column

Larger individual text columns get their own page to allow for proper reading.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload