HTML 연습 레이아웃 하단 풋터 위치 잡기

이거 알고 싶어서 생고생한거 생각하면 진짜 아오~~~

이래서 독학이 힘든거지 학원이든 학교에서 배우면 걍 손 들고 질문 한번하면 해결 될 문제로 혼자 끙끙 앓고.....

뭐....그래도 이렇게 고생해서 알았으니 까먹진 않겠지

/*html*/

<footer id="foot-r" class="clearfix">

    <div class="foot-1"><h4>로고</h4></div>

    <div class="foot-2"><h4>Copyright</h4></div>

    <div class="foot-2"><h4>SNS</h4></div>

</footer>

/*css  "로고" 우측 단독위치      */ 

#foot-r {height:100px;}

#foot-r > div {}

#foot-r > div.foot-1 {float: right; height:100px; width: 300px; background:#888;}

#foot-r > div.foot-2 {float: right; height:50px; width: 900px; background:#777;}

#foot-r > div.foot-3 {float: right; height:50px; width: 900px; background:#666;}

/*css  "로고" 좌측 단독위치      */ 

#foot-r {height:100px;}

#foot-r > div {}

#foot-r > div.foot-1 {float: left; height:100px; width: 300px; background:#888;}

#foot-r > div.foot-2 {float: left; height:50px; width: 900px; background:#777;}

#foot-r > div.foot-3 {float: leftt; height:50px; width: 900px; background:#666;}