Hi, guys!
I started prototyping this site a little while ago. Some of the code may be a little bit ugly, but I'm cleaning it up as I go along.
I spent a very long time doing flash sites and I am trying to brush up on my css.
So, I have a blog inside of an iframe & I would like to create a div that extends to the length of the content. I need a little bit of guidance.
The blog content HTML:
<div id='outerdiv'>
<iframe src="http://www.blog.puppetheap.com" id='inneriframe' scrolling="no"></iframe>
</div>The blog content CSS:
#outerdiv
{
width:1200px;
height:1800px;
overflow:hidden;
position:absolute;
margin:0 0 0 175px;
top: 505px;
display: block;
float: left;
z-index:6;
border:none;
}
#inneriframe
{
position:absolute;
top:-215px;
left:-25px;
width:680px;
height:1800px;
border:none;
}The site layout CSS:
body {
overflow : scroll;
background-attachment : fixed;
background-color : #ffffff;
background-image : url("http://www.puppetheap.com/test/Background_tiling.jpg");
background-position : 0% 0%;
background-repeat : repeat;
margin-bottom : 0;
margin-left : 0;
margin-right : 0;
margin-top : 0;
padding-bottom : 0;
padding-left : 0;
padding-right : 0;
padding-top : 0;
}
div.clearFloat {
clear : both;
font-size : 0;
height : 0;
line-height : 0;
}
li.clearFloat {
clear : both;
}
ul.symbolList {
display : inline;
float : left;
list-style-type : none;
margin : 0;
padding : 0;
}
.AbsWrap {
position : relative;
width : 100%;
}
.rowWrap {
width : 100%;
}
#main {
margin : 0 auto;
width : 1045px;
}
#pagebody_r2_c1 {
margin-left : 3px;
margin-top : 30px;
display : inline;
float : left;
height : 488px;
margin-bottom : 0;
width : 517px;
}
#pagebody_r2_c2 {
margin-left : 0;
margin-top : 84px;
display : inline;
float : left;
height : 434px;
margin-bottom : 0;
width : 520px;
}
#pagebody_r3_c1 {
margin-left : 72px;
margin-top : 0;
display : inline;
float : left;
height : 209px;
margin-bottom : 0;
width : 893px;
}
#pagebody_r4_c1 {
margin-left : 132px;
margin-top : 0;
display : inline;
float : left;
height : 222px;
margin-bottom : 0;
width : 765px;
}
#pagebody_r5_c1 {
margin-left : 126px;
margin-top : 0;
display : inline;
float : left;
height : 200px;
margin-bottom : 0;
width : 781px;
}
#pagebody_r6_c1 {
margin-left : 131px;
margin-top : 0;
display : inline;
float : left;
height : 158px;
margin-bottom : 0;
width : 775px;
}
Any advice/tips would be greatly appreciated. :)
Thanks!