www.webdeveloper.com
Results 1 to 8 of 8

Thread: Weird dots appearing behine my background image

  1. #1
    Join Date
    Jul 2008
    Posts
    93

    Weird dots appearing behine my background image

    Hello,

    If you go to: http://www.arcolacovenant.org/redesign_index

    The top and bottom bars and the about us drop down menu, there are these dots that are appearing in rows.

    Does anyone know why that's happening? The background image is a 1x1 dot with 65% transparency that I created in Fireworks.

    Any idea?

  2. #2
    Join Date
    Jan 2004
    Location
    chertsey, a small town s.w. of london, england.
    Posts
    1,458
    Hi there llckll,

    the weird dots do not appear behind your background image, they are a part of it.

    I have put a replacement image for you in the attached zip file.

    coothead
    Attached Files Attached Files

  3. #3
    Join Date
    Jul 2008
    Posts
    93
    thanks so much. I didn't realize it was part of it.

  4. #4
    Join Date
    Jan 2004
    Location
    chertsey, a small town s.w. of london, england.
    Posts
    1,458
    No problem, you're very welcome.
    coothead

  5. #5
    Join Date
    Jul 2008
    Posts
    93
    Was it because my canvas background was not transparent?

  6. #6
    Join Date
    Jan 2004
    Location
    chertsey, a small town s.w. of london, england.
    Posts
    1,458
    Hi there llckll,

    I couldn't really say.

    They did seem to be the same size as the dots to the bottom right of you slide show.

    coothead

  7. #7
    Join Date
    Jul 2008
    Posts
    93
    Hey Coothead, I'm going to need your assistance one more time...

    http://arcolacovenant.org/Redesign_Inside

    Do you know how to prevent the content breaking out of the div tag? Rather, it should push the bottom gray bar and footer down.

    Thanks.

  8. #8
    Join Date
    Jan 2004
    Location
    chertsey, a small town s.w. of london, england.
    Posts
    1,458
    Hi there llckll,

    make the following amendments to your CSS...

    ...change this...
    Code:
    #body_container {
    	width: 900px;
    	height: 550px;
    	background-color:#FFF;
    	margin: 0px auto 0px auto;
    	-webkit-box-shadow: 0px 0px 35px #000;
    	-moz-box-shadow: 0px 0px 35px #000;
    	-o-box-shadow: 0px 0px 35px #000;
    	box-shadow: 0px 0px 35px #000;
    }
    
    ...to this...
    Code:
    #body_container {
        width:900px;
        background-color:#fff;
        margin:auto;
        -webkit-box-shadow:0 0 35px #000;
        -moz-box-shadow:0 0 35px #000;
        -o-box-shadow:0 0 35px #000;
        box-shadow:0 0 35px #000;
     }
    
    ...and this...
    Code:
    #body_content_container
    {
    	width: 900px;
    	height: 100%;
    	background-image:url(http://www.arcolacovenant.org/redesign/images/top_bar_bg.png);
    	background-repeat: repeat-x;
    	background-position: bottom;
    	overflow: auto;
    	
    }
    
    ...to this...
    Code:
    #body_content_container {
        padding-bottom:40px;
        background-image:url(http://www.arcolacovenant.org/redesign/images/top_bar_bg.png);
        background-repeat:repeat-x;
        background-position:bottom;
        overflow:hidden;
     }
    
    ...and finally, this...
    Code:
    #body_content {
    	margin: 40px 0px 0px 200px;
    	padding: 0px 0px 0px 0px;
    	position: absolute;
    }
    
    ...to this...
    Code:
    #body_content {
        margin:40px 0 0 200px;
     }
    
    coothead

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
HTML5 Development Center



Recent Articles