WordPress.org

Ready to get started?Download WordPress

Forums

Problem with div box backgrounds (4 posts)

  1. everm0re
    Member
    Posted 4 years ago #

    Hi WPeople o/

    I'm working in my first theme and my XHTML knowledge wasnt used for some years so this might be really easy problem and i just dont get it :P

    My index page basicalle looks like that

    headerinclude
    -------------

    <div id="container">
     <div id="posts">
       ...
     </div>
     <div id="sidebar>
       ...
     </div>
    </div>

    --------------
    footerinclude

    css looks something like that:

    body{
            ...
            background: #000000;
            ...
    }
    #container {
            position: relativ;
            top: 242px;
            width: 950px;
    
            background: #505050;
            padding: 0 0 0 0;
            margin: 0 0 0 0;
    }
    #posts{
    
    	float: left;
    	width: 600px;
            background: #7a7a7a;
    }
    #sidebar{
    	float: right;
    	width: 350px;
            background: #505050;
    	margin: 0 0 0 0px;
    
    }

    -----
    so my "container" div is just a div to group the posts and sidebar together. I do this because the sidebar container ends when the content of it ends and the background color of it stops there. But i want the background color of the sidebar to continue as far as the posts-div goes. For that i tried to use the container div to show the general background color i want.

    In IE it seems to work, but in both Chrome & Firefox, i have the problem that after the sidebar content, i get the body background color down to the start of the footer and not the background of the container-div.

    How can i make this work in all browsers?

  2. mrdthomas
    Member
    Posted 4 years ago #

    Try adding overflow: auto; to your #container

  3. everm0re
    Member
    Posted 4 years ago #

    added the overflow: auto; that caused the container div to be next to my header-div. But the thing with the background color worked. Now i just needed to also give the container the float: left; style and it works perfectly now.

    Thanks!

  4. mrdthomas
    Member
    Posted 4 years ago #

    You are welcome this thread should be marked resolved.

Topic Closed

This topic has been closed to new replies.

About this Topic

Tags

No tags yet.