Moving the Shows section but having issues with other divs Options

[shynomi]

Is there something i can add or take out of this code so it doesn't move my left side covering div and the top header div? or do i have a code that would be conflicting? Thanks guys.

Here's the code I'm using:

CODE

<style type="text/css">
.i {display:none;}
{! recover and position shows !}
table table td.text div table {display:block;}
table table td.text div {position:absolute; top: 550px; left:32px;}
{! Reverse effect on Friend and Comment Divs !}
table table td.text table.friendSpace td.text div,
table table.friendsComments td.text div {position:static;
overflow:hidden; height:auto}
</style>

here's my current code for the layout (still in progress)

CODE

<style>
.profileWidth {
padding-bottom:1505px !important;}
</style>


<div id="BannerUnderTopNav" style="position:absolute; z-index:2; margin-left:-363px; _margin-left:-346px; top: 0px; background-color:COLOR; background-image:URL(http://i382.photobucket.com/albums/oo268/dygynomi/2010%20JAMES%20MCVEY/header.jpg) ; background-repeat: no-repeat; background-position: bottom center; width:826px; height:1722px; overflow:no;}">






</div>

<style>
.tg_left {position:absolute; margin-top:-0px; margin-left:-400px; left:50%; top:1746px; width:310px; height:700px; background-color:695741; z-index:2;}
</style>




<div class="tg_left">





<br /><br />




</center>


<table width="250px" border="0" cellspacing="3" cellpadding="3">



<tr>

<td>_HOMETOWN</td><td><div align="right">Boston, MA</div></td>
</tr>


<tr>

<td>_{OFFICIAL URL}</td><td><div align="right"><a href="http://www.msplinks.com/MDFodHRwOi8vd3d3LmJyaWFuYWNhc2guY29t">www.brianacash.com</div></td>
</tr>

<tr>
<td>_CONTACT</td>
<td><div align="right"><a href="mailto:briana@brianacash.com">briana@brianacash.com</a><br /></div></td><br />

</tr>

<tr>
<td>_BOOKING</td>
<td><div align="right"><a href="mailto:management@brianacash.com">management@brianacash.com</a><br /></div></td><br />

</tr>


<tr>
<td>_LAYOUT</td>
<td><div align="right"><a href="mailto:frucafrucaposters@gmail.com">Fruca Fruca Design</a><br /></div></td>
</tr>
</table>

<br /><br />


</div>


<style>ul li a:link, ul li a:active, ul li a:visited ul li a.open:visited, ul li a:link, ul li a:active, ul li a:visited {font: bold 10px arial !important; letter-spacing: -1px !important; text-transform: uppercase; margin-top: 7px; text-align:left;}</style>


<style>.whitetext12{visibility:hidden; display:none;}.lightbluetext8{visibility:hidden; display:none;}</style>

<style>
.friendText {display:none}
.redLink {display:none}
</style>

<style>
table table table table div {visibility:hidden;}
div table table table table table div input, div a, td.text div {visibility:visible;}
table table table table div {visibility:hidden;}
div table table table table table div input, div a, td.text div {visibility:visible;}
</style>


<style>.contactTable {width:300px!important; height:150px!important; padding:0px!important; background-image:; background-attachment:scroll; background-position:center center; background-repeat:no-repeat; background-color:transparent;} .contactTable table, table.contactTable td {padding:0px !important; border:0px; background-color:transparent; background-image:none;} .contactTable a img {visibility:hidden; border:0px!important;} .contactTable a {display:block; height:28px; width:115px;} .contactTable .text {font-size:1px!important;}.contactTable .text, .contactTable a, .contactTable img {filter:none!important;} .contactTable .whitetext12 {display:none;}</style>

<style>
.nametext {
display:block;
background-repeat:no-repeat;
background-position:left;
height:0px;
background-image:;
padding: 0;
margin: 0;
text-indent: -9999px;
}
</style>




<style>

{THIS MAKES THE BODY TABLE TRANSPARENT}
{*NOTE* - IF YOU DO NOT WANT THE BODY TABLE TRANSPARENT, SIMPLY CHANGE TRANSPARENT TO A COLOR}


body{ font-size:x-small;
background-color:695741;
background-image:url(http://i382.photobucket.com/albums/oo268/dygynomi/2010%20JAMES%20MCVEY/bgcopy.jpg);
background-attachment:fixed;
background-repeat: no-repeat;
background-position:top center;
margin-top: 0px;}


{THIS EDITS THE MAIN TEXT STYLE AND COLORS}body, div, p, strong, td, .text, .blacktext10, .blacktext12, a.searchlinkSmall, a.searchlinkSmall:link, a.searchlinkSmall:visited{color:ffffff;font-size:8pt;font-weight:normal;font-style:normal;text-decoration:none;text-transform:none;font-family:arial;}

{THIS CHANGES COLOR AND STYLE OF NAMETEXT AND HEADINGS}.orangetext15, text, strong, .lightbluetext8, .whitetext12, .nametext, .btext, .redtext, .redbtext{color:ffffff;font-size:8pt;font-weight:normal;font-style:normal;text-decoration:none;text-transform:none;font-family:arial;}

{THIS CHANGES COLOR AND STYLE OF LINKS}a, 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:f1d8a7;font-size:8pt;font-weight:bold;font-style:normal;text-decoration:none;text-transform:bold;font-family:arial;}

{THIS CHANGES COLOR AND STYLE OF LINKS ON HOVER}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:ffffff;font-size:8pt;font-weight:bold;font-style:normal;text-decoration:none;text-transform:bold;font-family:arial;}

{THIS ALSO MAKES THE BODY TABLE TRANSPARENT AND MAKES SURE ALIGNMENTS ARE FINE}{NOTHING NEEDS TO BE CHANGED HERE EXCEPT IF YOU WANT THE FONT CHANGED}p {margin: 0px 0px 1em 0px; font-family: arial !important}body>div {margin-left: 0px;}table, tr, td, table table, table table td {border-width:0px; background-color: transparent;}table table table td {background-color:transparent;margin:0px;padding: 0 0px 0px 0px}table table table table {border-width:0px;background-color:transparent;padding:0px;margin:0px; background-image: none;}table table table table td {padding:0px;margin:0px;}table table table { background-color: transparent; border: 0 solid; border-color: transparent; width: 100%; }object {position:relative; z-index:1;}body td table, body div table {margin-top: 0px;}.a {hide URL label}.a {hide top links}.a {unhide navigation bar}.navbar {visibility:visible;}

{THIS HIDES BASICALLY EVERYTHING ON THE LEFT SIDE]{*NOTE* - IF YOU DON'T WANT THE LEFT SIDE HIDDEN, TAKE OUT EVERYTHING BUT .ORANGETEXT15 AND .WHITETEXT12}.contactTable {display: none;}.navigationbar {display: none;}.userprofileurl {display: none;}.profileInfo{display:none;}.whitetext12 {display: none;}img {border:0px;}{THIS HIDES UNNECESSARY BORDER LINES WHEN HIDING SECTIONS}table table table table div {visibility:hidden;}div table table table table table div input, div a, td.text div {visibility:visible;}</style>





<center>
<br /><br />

<a href="http://www.msplinks.com/MDFodHRwOi8vd3d3LmJyaWFuYWNhc2guY29t"><img src="http://i382.photobucket.com/albums/oo268/dygynomi/BRIANA%20CASH/banner.jpg" /></a><br /><br />

COPY AND PASTE THIS CODE TO POST MY BANNER!<br />
<textarea><a href="http://www.brianacash.com"><img src="http://i382.photobucket.com/albums/oo268/dygynomi/BRIANA%20CASH/banner.jpg"></a></textarea><br /><br />




<br /><br />








<span class="off">!-Start Block to Shift Comments To Center-!</span>
<style>
{!-Change the top px value as needed. This is distance B on the chart-!}
table.friendscomments {position:relative; left:-1%;}
table.friendscomments {width:800px !important;}
table.friendscomments td, table.friendscomments table {width:100% !important}
table.friendscomments table table td {width:auto !important;}
</style>
<span class="off">!-END Block to Shift Comments To Center-!</span>


<style>
table.friendsComments tbody tr td.text table tbody tr td span.orangetext15{
background-image: url("");
background-repeat: no-repeat !important;
background-color: transparent;
display: block !important;
height: 60px !important;
color: ffffff!important;
width: 800px;
position: relative;
overflow: hidden;
font-size: 1px;
text-align: right;
margin-top: -1px;
line-height: 300px !important;
_width: 800px !important;
_border-left: 1px ffffff!important;
_border-right: 1px ffffff!important;
_height: 70px !important;
_margin-bottom: -1px !important;
}
</style>




<style>
.orangetext15{display:none}
</style>

<style>embed, object {position:absolute; top:1002px; left:50%; margin-left: -58px; z-index:9; } td td td embed, td td td object { position:static; margin-left:0px; }</style>

[Mickey]

Look for and remove this bit from your codes:

CODE

table table table { background-color: transparent; border: 0 solid; border-color: transparent; width: 100%; }

Then use my code instead to move it around.

[shynomi]

awesome, let me try this when i get back home and i'll post back the results.



Well it definitely made it look a bit cleaner. I found the code you told me to take out and got that out but now I'm having a problem getting it to line up right. You can see now it's slightly to the right. I tried setting the margin left attribute even more left but it's not wanting to go anymore to the left than where it's at.

also with this code, if they add more shows is it going to start hovering over the blog section, or will it move the blog section down like a normal myspace page would?

here's the link again: www.myspace.com/frucatestpage

thanks,
Nate

Reason for edit: Please use the Edit button instead of double-posting. - Mike

[Mickey]

Posts merged.

Since that code uses absolute positioning, the Latest Blog Entry table should take the place of the Upcoming Shows table and not move however many shows you post. As for the margin problem, remove all this instead of the little bit I previously posted:

CODE

table table table td {background-color:transparent;margin:0px;padding: 0 0px 0px 0px}table table table table {border-width:0px;background-color:transparent;padding:0px;margin:0px; background-image: none;}table table table table td {padding:0px;margin:0px;}table table table { background-color: transparent; border: 0 solid; border-color: transparent; width: 100%; }

[shynomi]

worked great, sorry about the double posting :(

[Mickey]

Topic closed & moved.