Results 1 to 4 of 4

Thread: problem with CSS : To overlap Div

  1. #1
    Join Date
    Apr 2008
    Posts
    51

    problem with CSS : To overlap Div

    Hi,

    I am working on my new websitein HTML with CSS, but I am stuck with the div tag & the Images.
    Actually the problem is when I try to use a DIV tag to include a layer over the top of another DIV, it wont work properly.
    I see a white gap between the images & I don't know how to avoid this?
    The problem is with Firefox browser as well as Internet explorer.

    If someone could please help me out? Can you tell me what should I check?

  2. #2
    Join Date
    Oct 2008
    Posts
    100

    Re: problem with CSS : To overlap Div

    Hello friend,

    I am also having same problem with my CSS code for DIV overlapping one on another at same place. I want to know how to use z-index but its not working for me.
    It will be better if you point me in right direction for Guide or tutorial.

  3. #3
    Join Date
    May 2008
    Posts
    29

    Re: problem with CSS : To overlap Div

    I think I can suggest you one thing to do with your image in DIVs CSS.
    try this:
    Code:
    #logo {
      float: left;
      padding-left: 12px;
      padding-right: 12px;
      width: 120px;
      height: 50px;
    }
    Now try this

    Code:
    <a id="logo" href="http://www.home.com"><img src="./images/logo.png" alt="image"/></a>

  4. #4
    Join Date
    Jan 2008
    Posts
    1,521

    Re: problem with CSS : To overlap Div

    Have a look at this Video:
    Div Overlay Tutorial



    Try this & see if this is what you want:

    Code:
    <html>
    <head>
    
    <title>Here is your title</title>
    
    <style type="text/css">
    
    a:link {
    color: #F00;
    text-decoration: none;
    }
    a:visited {
    color: #F00;
    text-decoration: none;
    }
    a:hover {
    color: #F00;
    text-decoration: none;
    }
    a:active {
    color: #F00;
    text-decoration: none;
    }
    
    body, html {
    background-color: #333;
    margin-top: 0px;
    margin-bottom: 0px;
    margin-left: auto;
    margin-right: auto;
    }
    
    div {
    width: 760px;
    padding: 0px;
    color: ivory;
    }
    
    #main {
    margin-left: auto;
    margin-right: auto;
    border-left: 1px dashed ivory;
    border-right: 1px dashed ivory;
    }
    #header {
    width: 100%;
    height: 150px;
    border-bottom: 1px dashed ivory;
    text-align: center;
    }
    #navigation {
    float: left;
    clear: left;
    width: 180px;
    border-right: 1px solid #abcdef;
    text-align: center;
    }
    #content {
    width: auto;
    float: left;
    clear: right;
    border: 1px solid red;
    padding-left: 5px;
    padding-right: 5px;
    text-align: justify;
    }
    #footer {
    float: left;
    clear:both;
    width: 100%;
    border-top: 1px dashed ivory;
    text-align: center;
    }
    
    </style>
    
    </head>
    <body>
    
    <div id="main">
    
    <div id="header">
    
    [Insert Header Here]
    
    </div>
    
    <div id="navigation">
    
    [Insert Navigation Here]
    
    </div>
    
    <div id="content">
    
    [Insert Content Here]
    
    </div>
    
    <div id="footer">
    
    [Insert Footer Here]
    
    </div>
    
    </div>
    
    </body>
    </html>

Similar Threads

  1. Replies: 3
    Last Post: 18-02-2011, 01:44 PM
  2. Maximized windows overlap by Locked taskbar
    By mich43 in forum Customize Desktop
    Replies: 4
    Last Post: 04-12-2010, 01:01 AM
  3. Sony VGNCS3 laptop 15 inch screen problem...LCD or CHIP problem?
    By Mick$Tyler in forum Hardware Peripherals
    Replies: 5
    Last Post: 31-10-2010, 06:49 AM
  4. Replies: 6
    Last Post: 19-09-2010, 12:03 AM
  5. Replies: 4
    Last Post: 10-04-2010, 04:19 PM

Tags for this Thread

Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
Page generated in 1,711,689,499.46483 seconds with 17 queries