CODEWITHSUNDEEP
htmlcss
adam
adam

Reputation: 41

My div dont want to be inside wrapper

My last div class="picture" doesnt want to get in wrapperdiv and expand its height. It comes outside the div, any thoughts how i can solve it?
i had to write some more text for make it possible to post 

 <div class="wrapper">                            
        <div class="logo"><img src="hello1.jpg"></div>

           <div class="menu"> 

            </div>
        </div>
        <div class="picture"><img src="hello.jpg"></div>

        </div>

my css.

    div.wrapper {
        max-width: 1100px;
        padding: 0 25px;
        margin: 0 auto;
        background:#333;

    }

    div.logo
    {
        width:30%;

        margin-left: auto ;
        margin-right: auto ;
    }

    div.menu
    {
        margin-left: auto ;
        margin-right: auto ;
        width:325px;
        background:#FFF;
    }
div.picture
{
    margin-left: auto ;
    margin-right: auto ;

}

Upvotes: 2

Views: 73

Answers (3)

Humphrey
Humphrey

Reputation: 2817

Please read the comments in this code you will be able to understand the problem. Thanks to dmackerman who gave you a straight answer . I am just trying to show you what you seem to be doing wrong . 

<div class="wrapper">                            
        <div class="logo"><img src="hello1.jpg"></div> <!--You closed the logo -->

           <div class="menu"> 

 </div><!--You closed the  menu -->
        </div> <!--You closed the wrapper here is where your problem comes from ithink -->
        <div class="picture"><img src="hello.jpg"></div > <!--You closed the  picture -->

        </div> <!--This is where the wrapper would have been closed,  but you have closed it earlier -->

Upvotes: 0

Billy_Bob
Billy_Bob

Reputation: 85

You have an extra "/div" above the class that is keeping it outside

Upvotes: 0

dmackerman
dmackerman

Reputation: 2966

Not sure what type of UI you're looking to accomplish, but you had some malformed HTML. Here's a quick solution. 

<div class="wrapper">                            
     <div class="logo">logo</div>
     <div class="menu">menu</div>
     <div class="picture">picture</div>
</div>

http://jsfiddle.net/gwqrut4k/

Upvotes: 3

Related Questions