Title: Background image doesn't load
Last modified: August 22, 2016

---

# Background image doesn't load

 *  [wpnici](https://wordpress.org/support/users/wpnici/)
 * (@wpnici)
 * [11 years, 8 months ago](https://wordpress.org/support/topic/background-image-doesnt-load-1/)
 * Hello everyone.
    I want to include an image into my theme like this:
 * HTML: (image will be defined in the CSS from “balken”)
 *     ```
       <div class="container">
       				<ul>
       					<li><div id="unternehmen"><a href="#">Unternehmen</a></div></li>
       					<li><div id="beratung"><a href="#">Beratung</a></div></li>
       					<li><div id="dienstleistung"><a href="#">Dienstleistung</a></div></li>
       					<li><div id="seminare"><a href="#">Seminare</a></div></li>
       					<li><div id="wissensportal"><a href="#">Wissensportal</a></div></li>
       					<li><div id="kontakt"><a href="#">Kontakt</a></div></li>
       					<div id="balken"></div>
       				</ul>
   
       			</div>
       ```
   
 * CSS:
 *     ```
       #balken{
       background-image: url(./images/balken2.png);
       background-repeat: no-repeat;
       position: relative;
       top: 50px;
       left: 198px;
       }
       ```
   
 * If I do it this way the image doesn’t load. But when I write some text in the
   HTML like this:
 * `<div id="balken">Testing</div>`
 * then the image loads. How can I make the image to be there without writing text?
   I don’t understand it :/

Viewing 7 replies - 1 through 7 (of 7 total)

 *  [stephencottontail](https://wordpress.org/support/users/stephencottontail/)
 * (@stephencottontail)
 * [11 years, 8 months ago](https://wordpress.org/support/topic/background-image-doesnt-load-1/#post-5339845)
 * Because the `<div>` has no content, the browser collapses it. You could put a
   non-breaking space: `<div id="balken">&nbsp;</div>`. You could also find another
   way to add the image, which might be easier and more maintainable in the future.
 *  Thread Starter [wpnici](https://wordpress.org/support/users/wpnici/)
 * (@wpnici)
 * [11 years, 8 months ago](https://wordpress.org/support/topic/background-image-doesnt-load-1/#post-5339847)
 * Okay do you have any ideas how to add the image in another way?
 *  Thread Starter [wpnici](https://wordpress.org/support/users/wpnici/)
 * (@wpnici)
 * [11 years, 8 months ago](https://wordpress.org/support/topic/background-image-doesnt-load-1/#post-5339848)
 * I have another empty div in the footer but there the image does load. That’s 
   why I don’t understand it
 * HTML:
 *     ```
       <footer id="footer">
       	<div id="footer_balken"></div>
       			<div class="container">
       				<nav id="nacSecondary">
       					<ul>
       						<li><a href="#">Navigationspunkt</a></li>
       						<li><a href="#">Navigationspunkt</a></li>
       					</ul>
       				</nav>
       			</div>
       		</footer>
       	<?php wp_footer();?>
       	</body>
       </html>
       ```
   
 * CSS:
 *     ```
       #footer_balken{
       background-image: url(./images/seitenbalken.png);
       height: 10px;
       width: 100%;
       }
       ```
   
 *  [stephencottontail](https://wordpress.org/support/users/stephencottontail/)
 * (@stephencottontail)
 * [11 years, 8 months ago](https://wordpress.org/support/topic/background-image-doesnt-load-1/#post-5339849)
 * Is there a reason you don’t just use `<img src="/images/balken2.png">`?
 *  [stephencottontail](https://wordpress.org/support/users/stephencottontail/)
 * (@stephencottontail)
 * [11 years, 8 months ago](https://wordpress.org/support/topic/background-image-doesnt-load-1/#post-5339850)
 * For your `#footer_balken`, it works because you’ve explicitly set a height for
   that element. You could also do that for your first post, as well.
 *  Thread Starter [wpnici](https://wordpress.org/support/users/wpnici/)
 * (@wpnici)
 * [11 years, 8 months ago](https://wordpress.org/support/topic/background-image-doesnt-load-1/#post-5339855)
 * Aahhh thanks that was my mistake 🙂
 * I use the div because I have diffrent pictures to move on diffrent places. If
   I would use the <img src=”—“> then all definations in the CSS would be for all
   images or am I wrong with that?
 *  [stephencottontail](https://wordpress.org/support/users/stephencottontail/)
 * (@stephencottontail)
 * [11 years, 8 months ago](https://wordpress.org/support/topic/background-image-doesnt-load-1/#post-5339977)
 * When you use `<img src="---">`, the `src` attribute sets the image, so you don’t
   need to define it in CSS.

Viewing 7 replies - 1 through 7 (of 7 total)

The topic ‘Background image doesn't load’ is closed to new replies.

 * 7 replies
 * 2 participants
 * Last reply from: [stephencottontail](https://wordpress.org/support/users/stephencottontail/)
 * Last activity: [11 years, 8 months ago](https://wordpress.org/support/topic/background-image-doesnt-load-1/#post-5339977)
 * Status: not resolved

## Topics

### Topics with no replies

### Non-support topics

### Resolved topics

### Unresolved topics

### All topics