layering a second image over a background image

Posted on 2012-08-17
Last Modified: 2012-08-17
If you would refer to the attached image, I'm trying to get the logo positioned in the upper left hand corner and I want to try and use some css elements to pull it off.

I've attached my code and stylesheet thus far. How could I get the logo in the upper left hand corner to sit on top of the gray and red stripes?


html {
      background: url(images/background.jpg) no-repeat center center fixed;
      -webkit-background-size: cover;
      -moz-background-size: cover;
      -o-background-size: cover;
      background-size: cover;

body {
margin: 0px 0px 0px 0px;


td {
      font-family: Verdana, Microsoft Sans Serif;
      font-size: 12px;
      color: #000000;

td.repeating_background {


<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "">
$cxn = mysqli_connect($host,$user,$password,$database)
or die ("couldn't connect to server");
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>Loose Cannon Fitness | Big, Loud and Outrageous | Bruce Gust</title>
<link href="stylesheet.css" rel="stylesheet" type="text/css" />
<script type="text/javascript" src="js/jquery.js"></script>
<script type="text/javascript" src="js/jquery.innerfade.js"></script>
<script type="text/javascript">
            speed: 1000,
            timeout: 5000,
            type: 'sequence',
            containerheight: '353px'
<map name="right_corner">
<area shape="rect" coords="9,8,206,32" href="show.php">
<area shape="rect" coords="226,10,271,31" href="login.php">
<area shape="rect" coords="294,7,431,36" href="" target="_blank">

<table width=100% cellspacing="0" cellpadding="0">
<td class="repeating_background">
home | about | videos | tracks | docs | contact
<A HREF="index.php"><IMG SRC="images/logo.png" width="250" border="0">
Question by:brucegust
    LVL 50

    Accepted Solution

    Like this. Add an id="logo" to your <a> element
    <a href="index.php" id="logo"><IMG SRC="images/logo.png" width="250" border="0">

    Open in new window

    #logo {
      position: absolute; 
      top: 0;  /* Change this to move to where you want it */
      left: 10%; /* Change this to move to where you want it */

    Open in new window

    LVL 7

    Expert Comment

    Possibly because you have already closed the <td> with class="repeating_background".

    Try giving the table the class class="repeating_background" instead of the <td>

    Author Closing Comment

    Off the hook!

    Featured Post

    Highfive + Dolby Voice = No More Audio Complaints!

    Poor audio quality is one of the top reasons people don’t use video conferencing. Get the crispest, clearest audio powered by Dolby Voice in every meeting. Highfive and Dolby Voice deliver the best video conferencing and audio experience for every meeting and every room.

    Join & Write a Comment

    As a result of several questions about how to use Bootstrap I thought it would be a good idea to write down the development aspect of creating a Bootstrapped website in as little time as possible. Part 1 of this article will only concentrate on g…
    Browsers only know CSS so your awesome SASS code needs to be translated into normal CSS. Here I'll try to explain what you should aim for in order to take full advantage of SASS.
    In this tutorial viewers will learn how to position overlapping items using z-index in CSS. They will also learn the restrictions on the z-index property.  Create a new HTML document with an internal stylesheet.: Create a div in CSS and name it Red.…
    The viewer will learn the benefit of using external CSS files and the relationship between class and ID selectors. Create your external css file by saving it as style.css then set up your style tags: (CODE) Reference the nav tag and set your prop…

    746 members asked questions and received personalized solutions in the past 7 days.

    Join the community of 500,000 technology professionals and ask your questions.

    Join & Ask a Question

    Need Help in Real-Time?

    Connect with top rated Experts

    16 Experts available now in Live!

    Get 1:1 Help Now