0

My problem is that when I try to make a container inside of my footer and add a margin between the footer and container for some reason this margin goes between footer and the body of my website.

Here is how i did set the footer and the margin:

<div id="footer">


            <div id="footer_content1">      
            </div>  
        </div>

This is the CSS for footer

#footer {
    background-color: white;
    width: 940px;
    height:100px;
    border-bottom: 2px solid black;
    border-right: 2px solid black;  
    border-left: 2px solid black;
    }

Here is the CSS for container:

#footer_content1 {
    background-color: blue;
    height: 50px;
    width: 500px;
    margin-top: 10px;
    }
tHawx
  • 1
  • 1
  • If you meant the 'space' between the blue div and the bottom border, its because you have a set height for the #footer id, remove it, and check out the results; now if you want the #footer_content1 to always be on the bottom,no matther the parents height, point it out in your question – RGLSV Nov 16 '14 at 20:29
  • it is quite scruffy, but you can add a line "border-top: 1px solid transparent" on the #footer: http://jsfiddle.net/1ksogryj/ – willi Nov 16 '14 at 20:39
  • i believe you can find your answer here also: http://stackoverflow.com/questions/9519841/why-does-this-css-margin-top-style-not-work – Eran.E Nov 16 '14 at 20:46

1 Answers1

1

please check your code first: in the css it says "#footer_content1" which is unequal to the html id "footer_container1"

willi
  • 127
  • 7