Why doesn’t the wrapper image background show up?

3 Views

I want to set a background image within my wrapper div.
Here’s the HTML document: 

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="<?php bloginfo('charset'); ?>">
    <title><?php echo get_bloginfo_rss('name'); ?> | <?php echo get_bloginfo_rss('description'); ?></title>
    <link rel="shortcut icon" href="<?php echo get_template_directory_uri (); ?>/genericons/favicon.ico" type="image/x-icon"/>
    <link rel="icon" href="<?php echo get_template_directory_uri(); ?>/genericons/favicon.png" type="image/png"/>
    <link rel="stylesheet" href="<?php echo get_template_directory_uri(); ?>/style.css" type="text/css"/>
    <?php wp_head(); ?>
</head>
<body>
    <div id="wrapper">

        <?php wp_footer(); ?>

    </div>
</body>
</html>

Here’s my CSS file:

Read More
body {
    background-color: #020111;
}

#wrapper {
    background-image: url('http://trytoknow.altervista.org/wp-content/themes/ttktheme/background.bmp');
    background-color: #020111;
    background-size: cover;
    width: 960px;
    height: auto;
}

If I paste the snippet in the CSS’s body section, it works as well as I do that through style inline for the body tag.
But I wish to set the background for the wrapper only. It doesn’t want to work! 

    body {
      background-color: #020111;
    }
    #wrapper {
      background-image: url('http://trytoknow.altervista.org/wp-content/themes/ttktheme/background.bmp');
      background-color: #020111;
      background-size: cover;
      width: 960px;
      height: auto;
    }
<div id="wrapper">

some text

</div>
Post Views: 3

Related posts

Leave a Reply

2 comments

  2. Increase you height or you can give increase padding
    If design disturb by increasing padding than try to give only e.g. bottom-padding:50px; etc

    I hope it will work for you.
    Thanks