Im making a layout where there is a slideshow under the player over the shows section.
The problem i have is when i put text or anything in the right hand side of the page it doesnt move the page down it just overlaps the friends section like so:
how do i rectify that?
Here is my code:-
CODE
<style>
.profileWidth table { margin-bottom:800px; width:800px; }
.rail { display:none; }
.gap {
background: top left no-repeat;
width:800px; height:800px;
position:absolute; top:0; left:50%;
margin:0px 0 -400px -800px;
</style>
<div class="gap"></div>
<style>
.toptext {position:absolute; left:50%; top:1377px; margin-left:-400px; _margin-left:-400px; width:800; height:250px; z-index:2;}
.slideshow {position:absolute; left:50%; top:1377px; margin-left:-400px; _margin-left:-400px; width:800; height:250px; z-index:3;}
</style>
<style>
.orangetext15 {display: none;}
.whitetext12 {display: none;}
table table div embed, table table div object {position:relative; z-index:9;}
table, tr, td{
background-color:transparent;
border-style:none;
}
body {
background-color: 000000;
background-image:;
background-position: top center;
background-repeat: repeat-x repeat-y;
background-attachment: fixed;
}
table table table table, table table table td{
background-image:none;
background-color:transparent;
}
body, div, p, strong, td, .text, .blacktext10, .blacktext12, a.searchlinkSmall, a.searchlinkSmall:link, a.searchlinkSmall:visited{
color:bcbcbc;
font-size:9pt;
line-height: 10pt;
font-weight:normal;
font-style:normal;
text-decoration:none;
text-transform:none;
font-family:Times New Roman;
}
strong, .lightbluetext8, .btext, .redtext, .redbtext{
color:4b7eac;
font-size:9pt;
font-weight:normal;
font-style:normal;
text-decoration:none;
text-transform:none;
font-family:Times New Roman;
}
a font, a:link, a:visited, a.navbar, a.navbar:link, a.navbar:visited, a.man, a.man:link, a.man:visited, a.man font, a.redlink, a.redlink:visited{
color:4b7eac;
font-size:9pt;
font-weight:normal;
font-style:normal;
text-decoration:none ;
text-transform:none;
font-family:Times New Roman;
}
a {
color: 4b7eac !important;
font-family: Times New Roman !important;
}
a:hover {
color: 666666 !important;
font-family: Times New Roman !important;
}
a:hover, a:hover font, a:active, a.navbar:hover, a.navbar:active, a.man:hover, a.man:active, a.man:hover font, a.searchlinkSmall:hover, a.searchlinkSmall:active, a.redlink:hover, a.redlink:hover{
color:666666;
font-size:10pt;
font-weight:normal;
font-style:normal;
text-decoration:normal ;
text-transform:none;
font-family:Times New Roman;
}
table table table table, div table table table{
border-style:none;
}
</style>
<style>
.latestBlogEntry {
position:absolute;
top:1025px;
margin-left: -390px;
left:50%;
width: 325px;
background-color: transparent;
z-index: 9;
}
table .latestBlogEntry {
width:325px!important;
}
html body.bodyContent table tbody tr td table tbody tr td.text table.friendSpace tbody tr td.text table tbody tr td span.orangetext15{
display: block !important;
height: 40px !important;
width: 325px !important;
margin: 0 !important;
padding: 0 !important;
font-size: 0px;
overflow: hidden;
background-image: url (http://i378.photobucket.com/albums/oo222/tgvisuals/Yardarm/friendsheader.jpg);
background-repeat: no-repeat;
color: bcbcbc !important;
line-height: 10px !important;
margin-top: -3px !important;
background-color: transparent !important;
}
html body.bodyContent table tbody tr td table.friendsComments {
width: 720px !important;
margin: 0 !important;
padding: 0 !important;
margin-top: 20px !important;
overflow: hidden !important;
background-color: transparent !important;
margin-left: -1px !important;
_width: 720px !important;
_margin-left: -12px !important;}
html body.bodyContent table tbody tr td table.friendsComments tbody tr td.text table {
width: 100% !important;
border-collapse: separate !important;
border-spacing: 0px 0px !important;
background-color: transparent !important;
height: auto !important;}
table.friendsComments tbody tr td.text table tbody tr td {
background-color: transparent !important;
height: auto !important;}
table.friendsComments tbody tr td.text table tbody tr td span.orangetext15 {
background-image: ;
background-repeat: no-repeat !important;
background-color: transparent;
display: block !important;
height: 40px !important;
color: 000000 !important;
width: 325px; position: relative;
overflow: hidden;
font-size: 0px;
text-align: right;
margin-top: 30px;
line-height: 300px !important;
_width: 325px !important;
_border-left: 1px 000000 !important;
_border-right: 1px 000000 !important;
_height: 40px !important;
_margin-bottom: -1px !important;}
html body.bodyContent table tbody tr td table.friendsComments tbody tr td.text table tbody tr td b {
display: block;
position: absolute;
z-index: 9;
width: 750px;
height: 15px;
line-height: 15px;
overflow: hidden;
margin: -25px 0 0 8px;
text-align: right;
padding-right: 12px !important;
color: 000000;
font-weight: normal;
font-size: 12px;
_margin: 0px 0 0 15px;
_font-size: 12px !important;
_color: 000000;}
html body.bodyContent table tbody tr td table.friendsComments tbody tr td.text table tbody tr td b span.redtext {
font-weight: normal;
color: 666666;
padding: 0px 2px;}
html body.bodyContent table tbody tr td table.friendsComments tbody tr td.text table tbody tr td b a {
color: 666666 !important;
font-size: 12px !important;
text-transform: none;
margin: 0 -7px 0 -8px !important;
padding: 0 9px 0 9px !important;
background-color: transparent !important;
position: relative !important;
display: inline !important;
z-index: 9;
border: none !important;
letter-spacing: 0px !important;
_font-size: 11px !important;
_margin: 0 !important;
_padding: 0 !important;}
html body.bodyContent table tbody tr td table.friendsComments tbody tr td.text table tbody tr td table {
overflow: hidden !important;
border: 1px 000000 !important;
border-color: 000000 !important;
width: 100% !important;}
html body.bodyContent table tbody tr td table.friendsComments tbody tr td.text table tbody tr td table tr td {
background-color: transparent !important;
text-align: left;
vertical-align: top;
overflow: hidden !important;
font-size: 12px !important;
line-height: 12px !important;
text-transform: none !important;
letter-spacing: 0px;
color: 000000 !important;
margin: 0 !important;
padding: 5px 0px 5px 0px;
border-bottom: 0px 000000 !important;
border-color: 000000 !important;
_line-height: 16px !important;}
html body.bodyContent table tbody tr td table.friendsComments tbody tr td.text table tbody tr td table tr td span.blacktext10 {
color: 1b476e !important;
text-transform: None !important;
margin: 0px !important;
padding: 0px important;
display: block !important;
font-size: 12px;
font-family: Times New Roman !important;
font-weight: normal;
letter-spacing: 1px;
text-align: right;
margin: 10px 10px -12px 0px !important;
width: 650px;
border-top: 1px 000000;
_margin: 12px 0px -.5em 0px !important;
_width: 650px;}
html body.bodyContent table tbody tr td table.friendsComments tbody tr td.text table tbody tr td {
background-color: transparent !important;}
html body.bodyContent table tbody tr td table.friendsComments tbody tr td.text table tbody tr td a {
display: block;
border: 0px 000000 !important;
border-color: ffffff !important;
border-top-style: solid !important;
border-top-width: 0px !important;
text-align: center;
text-transform: Uppercase;
padding: 8px;
font-size: 12px;
letter-spacing: 1px;
color: transparent !important;
position: relative !important;
margin-top: -3px !important;
background-color: transparent;
_margin-top: -6px !important;}
html body.bodyContent table tbody tr td table.friendsComments tbody tr td.text table tbody tr td table tr td a {
display: block !important;
color: 1b476e !important;
margin: 0px !important;
padding: 10px 10px 0px 10px !important;
text-transform: none !important;
margin-bottom: -15px !important;
font-size: 12px !important;
line-height: 11px !important;
border: none !important;
letter-spacing: 0px !important;
text-align: center !important;
width: 110px !important;
overflow: hidden !important;
font-weight: normal;
_width: 124px !important;
_margin-bottom: -15px !important;}
html body.bodyContent table tbody tr td table.friendsComments tbody tr td.text table tbody tr td table tr td a img {
visibility: visible !important;
border: 0px 008080 !important;
border-color: 000000 !important;
padding: 0px !important;
margin: 0px !important;
margin-top: -12px !important;
width: auto !important;
_margin-left: 0px;}
html body.bodyContent table tbody tr td table.friendsComments tbody tr td.text table tbody tr td table tr td img.ImgOnlineNow {
display: block;
position: relative;
margin: 15px 0 -20px 26px !important;
border: none !important;
_margin: 15px 0 -20px 21px !important;}
html body.bodyContent table tbody tr td table.friendsComments tbody tr td.text table tbody tr td table tr td img {
max-width: 100%;
margin: 0px !important;
margin: 0px 0px 12px 0px !important;}
table table table table td.text span.whitetext12 {
position: relative;
top: 0px;
display: block;
left: 0px;
visibility: visible;
width: 1px;
height: 10px;
text-indent: -999999px;
background: transparent bottom left no-repeat;
}
</style>
<div class="topbanner">
<img />
</div>
<div class="shows">
<img />
</div>
<div class="toptext">
<img />
</div>
<div class="ss1">
</div>
<div class="ss2">
</div>
<div class="ss3">
<br />
<br />
<br />
<br />
<br />
<center>
</div>
<div class="toptext"><img src="http://i378.photobucket.com/albums/oo222/tgvisuals/Yardarm/slideshowtest.jpg" /></div>
</div>
<div class="slideshow"><img /><div style="width:800px; text-align: center;"><object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" height="240" width="800">
<param name="allowScriptAccess" value="never" />
<param name="allowNetworking" value="all" />
<param name="movie" value="http://w378.photobucket.com/pbwidget.swf?pbwurl=http://w378.photobucket.com/albums/oo222/tgvisuals/Yardarm/a95876ba.pbw" />
<param name="wmode" value="transparent" />
<embed type="application/x-shockwave-flash" allowScriptAccess="never" allowNetworking="all" src="http://w378.photobucket.com/pbwidget.swf?pbwurl=http://w378.photobucket.com/albums/oo222/tgvisuals/Yardarm/a95876ba.pbw" height="240" width="800" wmode="transparent" />
</object><a href="http://www.msplinks.com/MDFodHRwOi8vcGhvdG9idWNrZXQuY29tL3NsaWRlc2hvd3M=" target="_blank"><img src="http://pic.photobucket.com/slideshows/btn.gif" style="float:left;border-width: 0;" /></a><a href="http://www.msplinks.com/MDFodHRwOi8vczM3OC5waG90b2J1Y2tldC5jb20vYWxidW1zL29vMjIyL3RndmlzdWFscy9ZYXJkYXJt
z9hY3Rpb249dmlldyZjdXJyZW50PWE5NTg3NmJhLnBidw==" target="_blank"><img src="http://pic.photobucket.com/slideshows/btn_viewallimages.gif" style="float:left;border-width: 0;" /></a></div>
<style>
table table table {visibility:hidden;}
td.text table {visibility:visible;}
</style>
<center> HERE GOES THE TEXT ITS GOOD ISNT IT HMMM YEAH YEAH YEAH TRA LA LA TRA LA LA</center>
.profileWidth table { margin-bottom:800px; width:800px; }
.rail { display:none; }
.gap {
background: top left no-repeat;
width:800px; height:800px;
position:absolute; top:0; left:50%;
margin:0px 0 -400px -800px;
</style>
<div class="gap"></div>
<style>
.toptext {position:absolute; left:50%; top:1377px; margin-left:-400px; _margin-left:-400px; width:800; height:250px; z-index:2;}
.slideshow {position:absolute; left:50%; top:1377px; margin-left:-400px; _margin-left:-400px; width:800; height:250px; z-index:3;}
</style>
<style>
.orangetext15 {display: none;}
.whitetext12 {display: none;}
table table div embed, table table div object {position:relative; z-index:9;}
table, tr, td{
background-color:transparent;
border-style:none;
}
body {
background-color: 000000;
background-image:;
background-position: top center;
background-repeat: repeat-x repeat-y;
background-attachment: fixed;
}
table table table table, table table table td{
background-image:none;
background-color:transparent;
}
body, div, p, strong, td, .text, .blacktext10, .blacktext12, a.searchlinkSmall, a.searchlinkSmall:link, a.searchlinkSmall:visited{
color:bcbcbc;
font-size:9pt;
line-height: 10pt;
font-weight:normal;
font-style:normal;
text-decoration:none;
text-transform:none;
font-family:Times New Roman;
}
strong, .lightbluetext8, .btext, .redtext, .redbtext{
color:4b7eac;
font-size:9pt;
font-weight:normal;
font-style:normal;
text-decoration:none;
text-transform:none;
font-family:Times New Roman;
}
a font, a:link, a:visited, a.navbar, a.navbar:link, a.navbar:visited, a.man, a.man:link, a.man:visited, a.man font, a.redlink, a.redlink:visited{
color:4b7eac;
font-size:9pt;
font-weight:normal;
font-style:normal;
text-decoration:none ;
text-transform:none;
font-family:Times New Roman;
}
a {
color: 4b7eac !important;
font-family: Times New Roman !important;
}
a:hover {
color: 666666 !important;
font-family: Times New Roman !important;
}
a:hover, a:hover font, a:active, a.navbar:hover, a.navbar:active, a.man:hover, a.man:active, a.man:hover font, a.searchlinkSmall:hover, a.searchlinkSmall:active, a.redlink:hover, a.redlink:hover{
color:666666;
font-size:10pt;
font-weight:normal;
font-style:normal;
text-decoration:normal ;
text-transform:none;
font-family:Times New Roman;
}
table table table table, div table table table{
border-style:none;
}
</style>
<style>
.latestBlogEntry {
position:absolute;
top:1025px;
margin-left: -390px;
left:50%;
width: 325px;
background-color: transparent;
z-index: 9;
}
table .latestBlogEntry {
width:325px!important;
}
html body.bodyContent table tbody tr td table tbody tr td.text table.friendSpace tbody tr td.text table tbody tr td span.orangetext15{
display: block !important;
height: 40px !important;
width: 325px !important;
margin: 0 !important;
padding: 0 !important;
font-size: 0px;
overflow: hidden;
background-image: url (http://i378.photobucket.com/albums/oo222/tgvisuals/Yardarm/friendsheader.jpg);
background-repeat: no-repeat;
color: bcbcbc !important;
line-height: 10px !important;
margin-top: -3px !important;
background-color: transparent !important;
}
html body.bodyContent table tbody tr td table.friendsComments {
width: 720px !important;
margin: 0 !important;
padding: 0 !important;
margin-top: 20px !important;
overflow: hidden !important;
background-color: transparent !important;
margin-left: -1px !important;
_width: 720px !important;
_margin-left: -12px !important;}
html body.bodyContent table tbody tr td table.friendsComments tbody tr td.text table {
width: 100% !important;
border-collapse: separate !important;
border-spacing: 0px 0px !important;
background-color: transparent !important;
height: auto !important;}
table.friendsComments tbody tr td.text table tbody tr td {
background-color: transparent !important;
height: auto !important;}
table.friendsComments tbody tr td.text table tbody tr td span.orangetext15 {
background-image: ;
background-repeat: no-repeat !important;
background-color: transparent;
display: block !important;
height: 40px !important;
color: 000000 !important;
width: 325px; position: relative;
overflow: hidden;
font-size: 0px;
text-align: right;
margin-top: 30px;
line-height: 300px !important;
_width: 325px !important;
_border-left: 1px 000000 !important;
_border-right: 1px 000000 !important;
_height: 40px !important;
_margin-bottom: -1px !important;}
html body.bodyContent table tbody tr td table.friendsComments tbody tr td.text table tbody tr td b {
display: block;
position: absolute;
z-index: 9;
width: 750px;
height: 15px;
line-height: 15px;
overflow: hidden;
margin: -25px 0 0 8px;
text-align: right;
padding-right: 12px !important;
color: 000000;
font-weight: normal;
font-size: 12px;
_margin: 0px 0 0 15px;
_font-size: 12px !important;
_color: 000000;}
html body.bodyContent table tbody tr td table.friendsComments tbody tr td.text table tbody tr td b span.redtext {
font-weight: normal;
color: 666666;
padding: 0px 2px;}
html body.bodyContent table tbody tr td table.friendsComments tbody tr td.text table tbody tr td b a {
color: 666666 !important;
font-size: 12px !important;
text-transform: none;
margin: 0 -7px 0 -8px !important;
padding: 0 9px 0 9px !important;
background-color: transparent !important;
position: relative !important;
display: inline !important;
z-index: 9;
border: none !important;
letter-spacing: 0px !important;
_font-size: 11px !important;
_margin: 0 !important;
_padding: 0 !important;}
html body.bodyContent table tbody tr td table.friendsComments tbody tr td.text table tbody tr td table {
overflow: hidden !important;
border: 1px 000000 !important;
border-color: 000000 !important;
width: 100% !important;}
html body.bodyContent table tbody tr td table.friendsComments tbody tr td.text table tbody tr td table tr td {
background-color: transparent !important;
text-align: left;
vertical-align: top;
overflow: hidden !important;
font-size: 12px !important;
line-height: 12px !important;
text-transform: none !important;
letter-spacing: 0px;
color: 000000 !important;
margin: 0 !important;
padding: 5px 0px 5px 0px;
border-bottom: 0px 000000 !important;
border-color: 000000 !important;
_line-height: 16px !important;}
html body.bodyContent table tbody tr td table.friendsComments tbody tr td.text table tbody tr td table tr td span.blacktext10 {
color: 1b476e !important;
text-transform: None !important;
margin: 0px !important;
padding: 0px important;
display: block !important;
font-size: 12px;
font-family: Times New Roman !important;
font-weight: normal;
letter-spacing: 1px;
text-align: right;
margin: 10px 10px -12px 0px !important;
width: 650px;
border-top: 1px 000000;
_margin: 12px 0px -.5em 0px !important;
_width: 650px;}
html body.bodyContent table tbody tr td table.friendsComments tbody tr td.text table tbody tr td {
background-color: transparent !important;}
html body.bodyContent table tbody tr td table.friendsComments tbody tr td.text table tbody tr td a {
display: block;
border: 0px 000000 !important;
border-color: ffffff !important;
border-top-style: solid !important;
border-top-width: 0px !important;
text-align: center;
text-transform: Uppercase;
padding: 8px;
font-size: 12px;
letter-spacing: 1px;
color: transparent !important;
position: relative !important;
margin-top: -3px !important;
background-color: transparent;
_margin-top: -6px !important;}
html body.bodyContent table tbody tr td table.friendsComments tbody tr td.text table tbody tr td table tr td a {
display: block !important;
color: 1b476e !important;
margin: 0px !important;
padding: 10px 10px 0px 10px !important;
text-transform: none !important;
margin-bottom: -15px !important;
font-size: 12px !important;
line-height: 11px !important;
border: none !important;
letter-spacing: 0px !important;
text-align: center !important;
width: 110px !important;
overflow: hidden !important;
font-weight: normal;
_width: 124px !important;
_margin-bottom: -15px !important;}
html body.bodyContent table tbody tr td table.friendsComments tbody tr td.text table tbody tr td table tr td a img {
visibility: visible !important;
border: 0px 008080 !important;
border-color: 000000 !important;
padding: 0px !important;
margin: 0px !important;
margin-top: -12px !important;
width: auto !important;
_margin-left: 0px;}
html body.bodyContent table tbody tr td table.friendsComments tbody tr td.text table tbody tr td table tr td img.ImgOnlineNow {
display: block;
position: relative;
margin: 15px 0 -20px 26px !important;
border: none !important;
_margin: 15px 0 -20px 21px !important;}
html body.bodyContent table tbody tr td table.friendsComments tbody tr td.text table tbody tr td table tr td img {
max-width: 100%;
margin: 0px !important;
margin: 0px 0px 12px 0px !important;}
table table table table td.text span.whitetext12 {
position: relative;
top: 0px;
display: block;
left: 0px;
visibility: visible;
width: 1px;
height: 10px;
text-indent: -999999px;
background: transparent bottom left no-repeat;
}
</style>
<div class="topbanner">
<img />
</div>
<div class="shows">
<img />
</div>
<div class="toptext">
<img />
</div>
<div class="ss1">
</div>
<div class="ss2">
</div>
<div class="ss3">
<br />
<br />
<br />
<br />
<br />
<center>
</div>
<div class="toptext"><img src="http://i378.photobucket.com/albums/oo222/tgvisuals/Yardarm/slideshowtest.jpg" /></div>
</div>
<div class="slideshow"><img /><div style="width:800px; text-align: center;"><object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" height="240" width="800">
<param name="allowScriptAccess" value="never" />
<param name="allowNetworking" value="all" />
<param name="movie" value="http://w378.photobucket.com/pbwidget.swf?pbwurl=http://w378.photobucket.com/albums/oo222/tgvisuals/Yardarm/a95876ba.pbw" />
<param name="wmode" value="transparent" />
<embed type="application/x-shockwave-flash" allowScriptAccess="never" allowNetworking="all" src="http://w378.photobucket.com/pbwidget.swf?pbwurl=http://w378.photobucket.com/albums/oo222/tgvisuals/Yardarm/a95876ba.pbw" height="240" width="800" wmode="transparent" />
</object><a href="http://www.msplinks.com/MDFodHRwOi8vcGhvdG9idWNrZXQuY29tL3NsaWRlc2hvd3M=" target="_blank"><img src="http://pic.photobucket.com/slideshows/btn.gif" style="float:left;border-width: 0;" /></a><a href="http://www.msplinks.com/MDFodHRwOi8vczM3OC5waG90b2J1Y2tldC5jb20vYWxidW1zL29vMjIyL3RndmlzdWFscy9ZYXJkYXJt
z9hY3Rpb249dmlldyZjdXJyZW50PWE5NTg3NmJhLnBidw==" target="_blank"><img src="http://pic.photobucket.com/slideshows/btn_viewallimages.gif" style="float:left;border-width: 0;" /></a></div>
<style>
table table table {visibility:hidden;}
td.text table {visibility:visible;}
</style>
<center> HERE GOES THE TEXT ITS GOOD ISNT IT HMMM YEAH YEAH YEAH TRA LA LA TRA LA LA</center>
any help would be great thanks
dolly