WEB css layout question

Discussion in 'OT Technology' started by AnoesisX, Feb 14, 2008.

  1. AnoesisX

    AnoesisX New Member

    Joined:
    Feb 19, 2005
    Messages:
    2,868
    Likes Received:
    0
    Location:
    Boca Rotten, Florida
    I'm having trouble aligning the top friends list under the post a comment and the comments under the top friends, as you can see http://www.myspace.com/daedorbeats here.
    This is an example of where the things I mentioned are supposed to be.

    here is the css
    Code:
        <style type="text/css">
    
    comments td.columnsWidening img,comments td.columnsWidening object {max-width:100% !important;width..this.width > 500 ? 500 : true);}</style><STYLE>
    header_gae {   text-align:center; margin-left:auto; margin-right:auto; }
    profilelinks { padding-right:25px;}
    profilelinks select { top: inherit !important; visibility:visible !important; WIDTH: 125px !important; display:inline !important; position:static; }
    body DIV DIV DIVprofilelinks{ VISIBILITY: visible !important; display:inline !important; position:static; padding-right:15px; }
    table div divtkn_leaderboard,table div divtkn_leaderboardDiv{ visibility:visible !important; display: inline !important;  }
    googlebar{VISIBILITY: visible !important;  display:inherit !important;   }
    </STYLE><STYLE>googlebar {margin-bottom:6px;margin-top:14px;padding-top:0px;}
    imgGoogle {    BACKGROUND-IMAGE: url(http://cms.myspacecdn.com/cms/Headers_and_Footers/googlelogo.png); BACKGROUND-REPEAT: no-repeat; _background-image:none;}
    
    imgGoogle {
        FILTER: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='http://cms.myspacecdn.com/cms/Headers_and_Footers/googlelogo.png', sizingMethod='image');
        WIDTH: 92px;    HEIGHT: 23px;}
    
    divheader_search selectt
    {
    vertical-align:bottom;
    }
    
    divheader_search 
    {
    width:100% !important;
    }
    
    </STYLE><STYLE>
    topnav{background-color:6698cb;}
    adspacer{height:35px;width:1px;}
    </STYLE>
    <style type="text/css">
        musicnav {width:800px; border-bottom:1px solid 000; background-color:990033; color:FFFFFF;}
        musicnav a {color:FFFFFF; font-weight:normal; font-size:90%; display:inline-block;}
    </style><STYLE type=text/css>
    browseMain td {text-align:left;}
    </STYLE>
    
    <STYLE type=text/css>
    *{ padding: 0px; }
    body{ visibility: visible; background-repeat: repeat-x; background-attachment: scroll; background-color: 000000; font-size: 12px; font-family: verdana; font-weight: normal; SCROLLBAR-FACE-COLOR: 660100; SCROLLBAR-HIGHLIGHT-COLOR: 3a3a41; SCROLLBAR-SHADOW-COLOR: 3a3a41; SCROLLBAR-ARROW-COLOR: 000000; SCROLLBAR-TRACK-COLOR: 3a3a41; SCROLLBAR-3D-LIGHT-COLOR: 3a3a41; SCROLLBAR-DARK-SHADOW-COLOR: 3a3a41; SCROLLBAR-LIGHT-SHADOW-COLOR: 3a3a41; }
    table table table table { visibility: hidden; }
    div table tr td font img { visibility: visible; display: none; }
    .navbar { visibility: visible; display: none; }
    .navbar font { visibility: hidden; display: none; }
    .blacktext{ visibility: hidden; display: none; }
    table, tr, td, li,div, font,p { font-family: arial,helvetica; color: 000000; font-size: 11px; font-weight: normal; background-color: transparent; border: none; border-width: 0; }
    a:link, a:active, a:visited { text-decoration: none; color: 999999; font-size: 10px; font-family: verdana; font-weight: bold; }
    H1, H2 { font-size: 20px; text-transform: uppercase; line-height: 18px; width: 100%; color: 362527; margin: 20px 0px 7px 0px; padding: 0px 0px 3px 0px; text-align: center; display: block; font-family: Verdana, Arial; font-weight: normal; border-width: 0px 0px 3px 0px; border-style: solid; border-color: 362527; width: 100%; }
    a:hover { text-decoration: none; color: 000000; font-family: verdana; font-weight: bold; }
    .blacktext12{ visibility: hidden; display: none; }
    .orangetext15, .whitetext12, .nametext, { display: none; visibility: hidden; }
    .redbtext, .redtext, .btext, .comt btext, btext.comt, span.btext, table tr td span.btext { color: 999999; font-size: 14px; }
    .comt td.btext{ width: 400px; }
    .redlink, a.redlink, a.redlink:link, a.redlink:visited, a.redlink:hover, a.redlink:active,  td.redlink:link, td.redlink{ color: 000000; position: relative; float: left!important; max-width: 400px!important; width: 350px; align: left; margin-left: 0px!important; margin-left: 0px; display: inline!important; display: inline; font-size: 12px; }
    a.btext:link, a.btext:hover, a.btext:active, a.btext:visited { color: 999999; }
    a img { border: 0px solid; border-color: 000000; }
    .Main { position: absolute; left: 50%; top: 160px!important; top: 150px; width: 850px; height: 400px; z-index: 1; margin-left: -425px; padding: 0px; border: 0px; background-color: transparent; }
    table td div div font { visibility: visible; color: black; }
    .orangetext15 { display: none; visibility: visible; }
    table tr td.text td table tr td table { visibility: visible; }
    table tr td table tr td table { visibility: visible; }
    .lightbluetext8 { color: ffffff; }
    .comt td.text table td b { display: block; visibility: hidden; position: absolute; width: 1px; left: 0%; margin-left: -1000px; top: 0px; }
    td.text td.text table table td b { display: inline; position: static; margin-left: 0px; }
    table td.text tr td  a, .redlink, td.text td b a { visibility: visible!important; }
    table table td.text td a { visibility: hidden; }
    .navbar { visibility: hidden; }
    .navbar font { visibility: hidden; }
    table.contactTable { display: none; }
    table table td.text table table { display: block; }
    .orangetext15, .whitetext12, .nametext { display: none; visibility: hidden; }
    table tr td font strong { visibility: hidden; }
    .contactTable { display: none; }
    table table table td.text { visibility: hidden; z-index: 4; overflow: visible; }
    td td td.text a img { z-index: 5; position: relative; visibility: hidden; border: 1px solid; border-color: black; max-width: 172px; max-height: 221px; left: -25px; top: 472px!important; top: 455px; }
    table table table td.text a img { width: 172px; height: 221px; }
    .blacktext10 { color: 362527; }
    .comt table tr td div { visibility: hidden; display: none; }
    .comt { position: absolute; width: 400px; max-width: 400px!important; height: 3000%; z-index: 3; overflow: hidden; left: 438px!important; left: 455px; top: 1700px; visibility: visible; background-color: transparent; align: left; div-align: left; margin: 0px; margin-left: 0px; padding: 0px; valign: top; word-wrap: break-word; }
    .comt table tr td td table td { visibility: visible; border: 0px solid; padding-left: 8px!important; padding-right: 8px!important; padding-bottom: 0px!important; padding-top: 0px!important; word-wrap: break-word; font-family: verdana; font-size: 9px; padding: 0px; width: 350px; position: relative; padding: 0px; margin-left: 0px!important; margin-left: 0px; }
    .comt table tr td a { visibility: visible; display: block; width: 30em!important; width: auto; padding: 0px; margin-left: 0px; font-family: verdana; font-size: 10px; left: 0px!important; text-align: center; border: 2px solid; }
    .comt embed { width: 200px; height: 180px; display: none!Important; display: block; }
    .comt span.btext { visibility: visible; overflow: visible; text-align: center; display: block!important; display: inline; width: 30em!important; padding: 0px; width: 350px; margin-left: 10px!important; display: list!important; margin-left: 0px; font-family: verdana; font-size: 12px; padding: 0px; left: 0px!important; border: 0px solid; }
    .comt table table { visibility: visible; left: 0px!important; left: -0px; top: 0px; border: 0px solid; width: 400px; max-width: 350px!important; padding: 0px; margin-left: 0px!important; margin-left: -5px; }
    .comt table tr td td table td td td { padding: 2px!important; font-family: verdana; font-size: 9px; max-width: 75px!important; width: 65px; padding: 2px; }
    .comt table tr td td table { border: 0px solid; position: relative:  top:0px; padding: 1px!important; margin-left: -5px!important; margin-left: 0px; padding: 0px; left: 0px!important; left: -20px; width: 65px; max-width: 75px!important; }
    .comt table table td.text table td.text{ border: 2px solid; width: 60px; padding: 0px; }
    .comt table tr td td { border: 0px solid; background-color: transparent; top: -20px!important; position: relative; top: 0px; left: -30px!important; left: 0px; font-family: verdana; font-size: 11px; visibility: visible; padding: 0px; width: 380px; }
    .comt td.text td { border: 0px solid; padding: 0px; margin-left: 0px; position: relative; left: 0px!important; top: 200px!important; top: 0px; left: 0px; overflow: hidden!important; width: 270px; color: 000000; font-size: 11px; }
    .comt td.text td td { border-bottom: 0px solid; padding-top: 1px; }
    .comt table td table a { position: relative; float: right; overflow: hidden; display: block!important; display: inline; border: 0px solid; max-width: 75px!important; width: 80px; word-wrap: break-word; padding: 3px; }
    .blacktext10, span.blacktext10 { visibility: visible; color: 000000; font-size: 14px; font-family: verdana; font-weight: bold; max-width: 200px!important; display: block!important; width: 280px; padding-top: 10px; }
    .comt td img, .comt a img { width: 70px; padding: 0px; align: left; max-width: 70px; }
    .comt img { width: 70px; border: 1px solid; text-align: left; max-width: 70px; padding: 0px; }
    .comt div img { width: 80px; height: 20px; text-align: left; border: 0px solid; max-width: 80px; padding: 0px; }
    .comt a:hover img { filter: progid:DXImageTransform.Microsoft.Pixelate (maxsquare=2); }
    a, td { word-wrap: break-word; }
    table table table tr table td { border-bottom: 0px solid; border-color: B2B6A8; }
    .comt table  tr td div div a { visibility: hidden; display: none; }
    .comt table  tr td div div { visibility: hidden; display: none; }
    table tr td font strong { visibility: hidden; }
    table table object{ display: block; z-index: 3; position: relative; top: 406px!important; top: 385px; left: 25px!important; left: 20px; visibility: visible; }
    table table embed{ display: block; z-index: 3; position: relative; top: -2px; left: -3px; visibility: visible; }
    table table table embed { position: static; }
    table tbody td table tbody tr td.text td table { visibility: visible; z-index: 6; position: relative; top: 0px; left: 0px; visibility: visible; border: 0px solid; vertical-align: top; }
    table tbody td table tbody tr td.text table { z-index: 6; position: relative; margin-top: 0px!important; margin-top: 0px; top: 450px; left: -370px; visibility: visible; border: 0px solid; width: 95%; }
    td.text table table table font { position: static; }
    td.text table table font .whitelink font .whitelink, td.text table font .whitelink font { visibility: hidden; }
    .comt table tbody td table tbody tr td.text table, .comt table tbody td table tbody tr td.text table table, .comt table tbody td table tbody tr td.text table table tbody td.text, .comt td.text table table 
    table font { position: static; }
    div table, div table a, div table td a, { position: relative; visibility: hidden; left: -0px; }
    div table tbody tr td { visibility: visible; }
    div table { background-color: transparent!important; border-bottom: 0px!important; }
    div td td a { display: inline; }
    div table a, body div table td font { visibility: visible; }
    div table tbody tr td { visibility: visible; }
    table input { visibility: visible; }
    div div table td a { visibility: visible; }
    hr { width: 350px; }
    div table tr td a img, div div table tr td img, div table tr td embed { width: 380px; }
    -->
    </style><style type="text/css">
    .commentlinks a { font-weight:normal; font-size:9px; }
    </style><STYLE type=text/css>
             tkn_leaderboard{visibility:visible !important; display:inline !important;}
            body TABLE TD DIVheader_gae {     VISIBILITY: visible !important;}
                    
            body DIV TABLE TD DIVgooglebar 
            {
                VISIBILITY: visible !important;            
                display:block !important;
                position:relative;
                ..;
            }
           
             body DIV DIV form q,
             body DIV DIV form t,
             body DIV DIV form submitBtn,
             body DIV DIV form imgGoogle         
            {
                VISIBILITY: visible !important; 
                display:inline !important; 
                position:static;
            }
    .r{}
    .photoDisplaySmall
    {
    width:56px;
    }
    
    .thumb
    {
    padding:0px !important;
    height:auto;
    }
        </STYLE></mspmb><br><br>
    and the HTML
    Code:
    <div class="Main"> <div style="position:absolute; width:850px; z-index:1; overflow: visible; left:px; 0top: 0px; height:1500px; visibility: visible; background-color: transparent;"> <img src="http://www.daedor.com/gc/1.jpg"><img src="http://www.daedor.com/gc/2.jpg"><img src="http://www.daedor.com/gc/3.jpg"></div> <div style="position:absolute; width:128px; z-index:9; overflow: visible; left:743px; top: 161px; height:122px; visibility: visible; background-color: transparent;"><a href="http://collect.myspace.com/index.cfm?fuseaction=invite.addfriend_verify&friendID=47212274&MyToken=a0800473-05ef-466c-9161-9deb64e818f5" .."MM_swapImgRestore()" .."MM_swapImage('Image41','','http://www.daedor.com/gc/buttons/af2.gif',1)"><img src="http://www.daedor.com/gc/buttons/af1.gif" name="Image41" width="132" height="29" border="0"></a><a href="http://messaging.myspace.com/index.cfm?fuseaction=mail.message&friendID=47212274&MyToken=a0800473-05ef-466c-9161-9deb64e818f5" .."MM_swapImgRestore()" .."MM_swapImage('Image42','','http://www.daedor.com/gc/buttons/sm2.gif',1)"><img src="http://www.daedor.com/gc/buttons/sm1.gif" name="Image42" width="132" height="29" border="0"></a><a href="http://collect.myspace.com/index.cfm?fuseaction=user.addToFavorite&friendID=47212274&public=0" .."MM_swapImgRestore()" .."MM_swapImage('Image43','','http://www.daedor.com/gc/buttons/atf2.gif',1)"><img src="http://www.daedor.com/gc/buttons/atf1.gif" name="Image43" width="132" height="29" border="0"></a><a href="http://messaging.myspace.com/index.cfm?fuseaction=mail.forward&friendID=47212274&f=forwardprofile" .."MM_swapImgRestore()" .."MM_swapImage('Image44','','http://www.daedor.com/gc/buttons/fp2.gif',1)"><img src="http://www.daedor.com/gc/buttons/fp1.gif" name="Image44" width="132" height="29" border="0"></a><a href="http://groups.myspace.com/index.cfm?fuseaction=groups.addtogroup&friendID=47212274" .."MM_swapImgRestore()" .."MM_swapImage('Image45','','http://www.daedor.com/gc/buttons/atg2.gif',1)"><img src="http://www.daedor.com/gc/buttons/atg1.gif" name="Image45" width="132" height="29" border="0"></a><a href="http://collect.myspace.com/index.cfm?fuseaction=block.blockUser&userID=47212274" .."MM_swapImgRestore()" .."MM_swapImage('Image46','','http://www.daedor.com/gc/buttons/bm2.gif',1)"><img src="http://www.daedor.com/gc/buttons/bm1.gif" name="Image46" width="132" height="29" border="0"></a></div> 
    
    <div style="position:absolute; width:221px; z-index:3; overflow: hidden; left:447px; top: 860px; height:136px; visibility: visible; background-color: transparent;"> <a START GENERAL INFO></a> <span class="style2">G.C.</span><br> <span class="style1"><b>Hip Hop - Palm Beach County</b></span><br> <br> <span class="style1"><b>Official Website</b></span>:<span class="style1">COMING SOON</span><br> <br> <span class="style1"><b>Label</b>: none</span><br> <br> <span class="style1"><b>View My:</b></span> <a href="http://viewmorepics.myspace.com/index.cfm?fuseaction=user.viewAlbums&friendID=47212274">Pics</a> | <a href="http://vids.myspace.com/index.cfm?fuseaction=vids.showvids&friendID=47212274&n=47212274&MyToken=a09e6d01-b143-4511-8787-00468c740f95">Videos </a> <a END GENERAL INFO</a></div> 
    
    <div style="position:absolute; width:400px; z-index:3; overflow: auto; left:446px; top: 1213px; height:303px; visibility: visible; background-color: transparent;"> <table width="350" align="center" cellpadding="0" cellspacing="0" border="0"><tr><td> <a START OF BIO></a> <span class="style2"><u>Biography</u></span> <p class="style1"> G.C. was born in Europe 18 years ago, and moved to florida 13 years ago to escape the struggle with his family. Having no money and nothing to their name, G.C. was born to make it. He started hustling as a young kid. Instead of taking the expected route and hustle drugs, he felt that hustling music was more positive, and chose to launch himself into the music industry about 5 years ago. Now in 2007, G.C. is being sought after by a couple different labels. G.C. is currently signed to an independent label named Illume Entertainment. He has been on numerous mixtapes: "Money Right" hosted by Flo-rida(Atlantic records) and Brisco (Cash money records), "Party Chronicles" hosted by DJ Gorilla and Joe Hound (Epidemic/Terror Squad),just to name a few. He has also been featured on songs with Dela Candela, Epidemic, Hennessi, Brisco, Flo rida, and many others. He has performed in many spots such as Hookah Hut, Irish Men Pub, Club TKO, Dek23, Draft House, Spanish River High School, Ali Baba's, Passions at the Hardrock ,Rumbass,and Skeeters Now this year he is on the verge of becoming the hottest thing to hit South Florida, with his hot new single "CALABRIA REMIX". "If it ain't about business, it ain't about me"- G.C. <p> <a END OF BIO></a> </tr></td></table> </div>
    
     <div style="position:absolute; width:408px; z-index:3; overflow: visible; left:22px; top: 1247px; height:500%; visibility: visible; background-color: transparent;"> <table width="100%" cellpadding="0" cellspacing="0" align="center" border="0"><tr> </tr><tr><td valign="top"> <img src="http://www.daedor.com/gc/vpm.jpg"><br><br> <a BEGIN PICS VIDS AND MORE></a> <center> </tr></td></table> <br><center><br><br> <br> designed by <a href="http://www.webosb.com" target="_blank">daedor.com</a><br><a href="mailto:[email protected]" target="_blank">[email protected]</a><br><a href="http://www.myspace.com/daedor" target="_blank">myspace.com/daedor</a></center> </div> <div style="position:absolute; width:850px; z-index:0; overflow: hidden; left:0px; top: 1000px; height:3300%; visibility: visible; background-color: transparent; background-image:url(http://www.daedor.com/gc/contentbg.jpg); background-repeat: repeat-y;"></div>
    
     <div style="position:absolute; width:384px; z-index:5; overflow: hidden; left:450px; top: 1511px; height:250px; visibility: visible; background-color: transparent;"> <center> <img src="http://www.daedor.com/gc/fc.jpg"> <form method="post" action="http://comments.myspace.com/index.cfm?fuseaction=user.ConfirmComment"> <input type="hidden" name="friendID" value="47212274" /> <textarea name="f_comments" cols="20" rows="4" style="background-color:ffffff; border-width:0px; border:0px; color:000000; font-family:verdana;filter:alpha(opacity=100); width: 256px; height:62px;"></textarea><br><input type="submit" name="submit" value="post comment" style="background-color:ffffff; border:1px solid; border-color: 000000;"/></form></center> </div> <div style="position:absolute; width:850px; height:20px; z-index:2; overflow: hidden; left: 0px; top:-20px!important; top:-20px; visibility: visible; background-color:000000; text-align: center;"><center><a href="http://home1.myspace.com/index.cfm?fuseaction=user" style="color:ffffff;">home</a> | <a href="http://browseusers.myspace.com/Browse/Browse.aspx?z=1" style="color:ffffff;">browse</a> | <a href="http://search.myspace.com/index.cfm?fuseaction=find"style="color:ffffff;">search</a> | <a href="http://invite.myspace.com/index.cfm?fuseaction=invite"style="color:ffffff;">invite</a> | <a href="http://rank.myspace.com/index.cfm?fuseaction=RateImage.rate"style="color:ffffff;">rank</a> | <a href="http://mail1.myspace.com/index.cfm?fuseaction=mail.inbox"style="color:ffffff;">mail</a> | <a href="http://blog.myspace.com/index.cfm?fuseaction=blog.controlcenter"style="color:ffffff;">blog</a> | <a href="http://favorites.myspace.com/index.cfm?fuseaction=user.favorites"style="color:ffffff;">favourites</a> | <a href="http://www.myspace.com/index.cfm?fuseaction=messageboard.categories"style="color:ffffff;">forum</a> | <a href="http://groups.myspace.com/index.cfm?fuseaction=groups.categories"style="color:ffffff;">groups</a> | <a href="http://events.myspace.com/index.cfm?fuseaction=events"style="color:ffffff;">events</a> | <a href="http://music.myspace.com/index.cfm?fuseaction=music"style="color:ffffff;">music</a> | <a href="http://www.myspace.com/index.cfm?fuseaction=classifieds"style="color:ffffff;">classifieds</a></div>   ffffff;">classifieds</a></div>  
    me and my friend have been trying to figure this out but nothing changes or it gets more screwed up. PLZ help:x:
    thanks
     
  2. 95vr4

    95vr4 OT Supporter

    Joined:
    Oct 6, 2004
    Messages:
    2,513
    Likes Received:
    0
    Location:
    Weddington, NC
    I've never messed with any myspace layouts but Wow..that's the biggest cluster fuck of a style sheet I've ever seen in my life. :eek3: That shit would probably take me a week to figure out. full paths won't even fit in the web developer toolbar.
     
  3. ROFLCORE

    ROFLCORE Guest

    Ask lolzilla, he's like an expert at that shit.
     
  4. kingtoad

    kingtoad OT Supporter

    Joined:
    Sep 2, 2003
    Messages:
    55,914
    Likes Received:
    8
    Location:
    Los Angeles
    :ugh: I'd normally help someone.
     
  5. pkr

    pkr Guest

    :rofl: I just starting laughing with some cereal in my mouth :rofl:
     
  6. pkr

    pkr Guest

    p.s. wear some sunglasses to your next photo shoot, player
     

Share This Page