CSS height, How to get it to go around inner divs


Tags: html,css

Problem :

Why is it that my border does not go around my inner divs, and my inner div borders do not go to the bottom of the outer div, ( in FF but need this for all major browser).

Can someone please help

<div id="main">
    <div class="insidediv">
        <p>Article 1</p>
    </div>
    <div class="insidediv">
        <p>Article 2</p>

    </div>
    <div class="insidediv">
<p>Article 3</p>
    </div>
</div>

#main{
    width: 800px;
    height: 100%;
    border: 20px solid black;
}

.insidediv{
    width: 200px;
    height: 100%;
    border-right: 20px solid black;
    float:left;
}


Solution :

Alter #main to float: left; or overflow:hidden. I recommend the float


    CSS Howto..

    How to make a background-color transition that eventually covers div to center? [closed]

    Box-shadow is overlapping other elements, how can I fix it?

    how do i get an div to stay in place while text around it gets bigger or shorter

    How do I style HTML in a JEditorPane?

    • centered, not moving down.. unsure why / how to fix

    how to set a fixed width to textbox which wont be affected by varying value of padding-left?

    How can I remove frame like background in twentysixteen theme

    Javascript/Jquery How to catch the use of a CSS class

    Rails: Stylesheet/view issue? Nothing is showing on the screen although there is source code when viewed in browser

    How to change opacity suddenly without transition (without fade) using keyframes

    How to Get Fixed Children to Play Nicely with their Parents

    How to align horizontally nav bar in css?

    How to style a PHP generated label?

    How do I determine if truncation is being applied in my style through JS?

    HTML/CSS- how to align part of a cell to the left, and part to the right?

    How can I include conversion from LESS to CSS in my ANT build file without including an extra Rhino .jar?

    Asp.Net how to apply a css style to all the control of it's kind

    Cutting out the middle portion of an image (example shown)?

    How to structure table based on Paper size using CSS & PHP?

    How to format an HTML table using CSS for printing?

    How to control cursor/caret size with CSS

    Inheriting CSS how do I stop it?

    How can i improve my javascript? codepen included

    How to reflect updates to CSS at runtime in Visual Studio 2012?

    How to read contents of an external script/style?

    Horizontal Navigation with Angled Side Borders - How to handle “Active” state?

    How to select multiple elements using CSS

    Why does this qtip2 show blank content on 2nd click?

    jqueryui menu's submenu — how to keep in front

    How to add css to dynamically created tables