div overlay help

Original Message

Name: Greensystemsgo
Date: April 12, 2007 at 12:32:01 Pacific
Subject: div overlay help
OS: xp pro
CPU/Ram: n/a
Model/Manufacturer: n/a

Comment:

I know many are going to cringe when they hear this, but here it goes.
I am trying to make an ultra personalized myspace using a layer over myspace's original design.
It looks ok for the most part, but a i had a few questions, (My codes messed up somewhere)
-------------------
I would like to make the layer centered.
-------------------
I want the layer's top edge rounded, so i made 2 rounded pictures, but they sink down.
------------------
lastly, i want the table to be locked at 800px diameter
------------------
Below is all the code im using...
I've exhausted google so plz dont give me some snide google remark
<style type="text/css">
.main {
position: absolute;
left: 100px;
top: 90px;
width: 800px;
z-index: 1;
}
</style>
<Style type="text/css">
table, tr, td{
background-color:transparent;
}
body{
background-image:url(http://i66.photobucket.com/albums/h277/Greensystemsgo/bg_grad.jpg);
background-position:top left;
background-repeat:repeat-x;
background-attachment:fixed;
}
a </Style>
<div class="main">
<table style="width: 0px;
height: 1000px;
cellpadding: 0px;
cellspacing: 0px;
background-color: FFFFFF;">
<tr><td valign="top">
<html>
<head>
<style type="text/css">
..
body {
background-image: url(http://i66.photobucket.com/albums/h277/Greensystemsgo/bg_grad.jpg);
background-repeat: repeat-x;
margin-bottom: 0px;
}
body,td,th {
color: #333333;
font-family: Geneva, Arial, Helvetica, sans-serif;
font-size: x-small;
}
a:link {
color: #004D8A;
text-decoration: underline;
}
a:visited {
text-decoration: underline;
color: #004D8A;
}
a:hover {
text-decoration: none;
color: #004D8A;
}
a:active {
text-decoration: underline;
color: #004D8A;
}
h1 {
color: #333333;
}
h2 {
color: #333333;
}
h3 {
color: #333333;
}
h4 {
color: #333333;
}
h5 {
color: #333333;
}
h6 {
color: #333333;
}
.style1 {font-family: Geneva, Arial, Helvetica, sans-serif}
.style2 {font-family: Geneva, Arial, Helvetica, sans-serif; font-size: small; }
.style6 {color: #005fa9}
.style7 {font-size: large}
.style10 {font-size: small}
.style12 {font-size: x-small}
.style13 {color: #333333}
-->
</style></head>
<body>
<table width="800" border="0" align="center" cellpadding="0" cellspacing="0" bgcolor="#FFFFFF">
<tr>
<td colspan="12"></td>
<td width="7"><div align="right"></div>
<div align="right"></div></td>
</tr>
<tr>
<td width="4"> </td>
<td colspan="7"><h1><span class="style1">Gr♠♠nsyst♠msgo</span></h1></td>
<td></td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td colspan="11"><div align="right"><form name="srch" id="srch" action="http://search.myspace.com/index.cfm?advancedFind.hub" method="get" ..="return chkGHeader();">
<div align="right">
<input name="q" type="text" class="feature" style="height:18px; width:250px" size="250
" />
<select id="t" name="t">
<option value="tms">MySpace</option>
<option value="tpeople">People</option>
<option value="tweb">Web</option>
<option value="tmusic">Music</option>
<option value="tblog">Blog</option>
<option value="tvid">Video</option>
<option value="tevents">Events</option>
<option value="tgroups">Groups</option>
<option value="tfilm">Film</option>
<option value="tclass">Classifieds</option>
</select>

<input type="submit" id="submitBtn" value="Search" style="font-size:10px" />
</div>
</form></div></td>
<td> </td>
</tr>
<tr>
<td colspan="13"></td>
</tr>
<tr>
<td> </td>
<td width="4"> </td>
<td width="4"> </td>
<td colspan="9"><div align="center"><span class="style2">Home | Browse | Search | Invite | Film | Mail | Blog | Favoriates | Forums | Groups | Events | Video | Music | Comedy | Classefieds </span></div></td>
<td> </td>
</tr>
<tr>
<td colspan="13"></td>
</tr>
<tr>
<td> </td>
<td> </td>
<td> </td>
<td width="64"> </td>
<td width="267"> </td>
<td width="3"> </td>
<td colspan="6"> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td> </td>
<td> </td>
<td colspan="2"><span class="style2">Gr♠♠nsyst♠msgo's Profile </span></td>
<td> </td>
<td colspan="6"><div align="right"></div></td>
<td> </td>
</tr>
<tr>
<td> </td>
<td> </td>
<td> </td>
<td colspan="2"> </td>
<td> </td>
<td colspan="6"> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td> </td>
<td> </td>
<td colspan="2" class="style6">
<span class="style10">MAIL <span class="style13">|</span> ADD</span></p></td>
<td> </td>
<td colspan="6"> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td> </td>
<td> </td>
<td class="style6">
</p></td>
<td colspan="8"><div align="center"><span class="style7">About Me</span></div></td>
<td> </td>
</tr>
<tr>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td><div align="center"></div></td>
<td colspan="7">
</p></td>
<td> </td>
</tr>
<tr>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td><div align="left"><span class="feature"></span></div></td>
<td> </td>
<td colspan="6"><p class="style10">Well Im 17 years old. I go the WHS, and work at a Pizza place. I love skatin, and hangin with the homeys. </p>
<p class="style10">I am infatuated by Jessica, she is one of the most important persons in my life and everyday persuades me to try push myself and try harder at life.. </p>
<p class="style10">I have a 1963 VW Bug, which hopefully one day will be completed. I am doing a rull rebuild, new engine, tranny, interior, etc... </p></td>
<td> </td>
</tr>
<tr>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td><div align="center">(View more Pictures)</div></td>
<td> </td>
<td colspan="6"> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td colspan="6"> </td>
<td> </td>
</tr>
<tr>
<td colspan="13"></td>
</tr>
<tr>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td colspan="8"> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td colspan="8"><div align="center"><span class="style10">Friends <span class="style12">(View All)</span> | Jessica | Missy | Ryan | Josh | TZL | Cassy</span></div></td>
<td> </td>
</tr>
<tr>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td colspan="8"> </td>
<td> </td>
</tr>
<tr>
<td colspan="13"></td>
</tr>
<tr>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td colspan="8"> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td colspan="8"><div align="center" class="style7">My Life </div></td>
<td> </td>
</tr>
<tr>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td colspan="8"><div align="left" class="style7">
<div align="center"></div>
</div></td>
<td> </td>
</tr>
<tr>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td colspan="8" rowspan="33"><table width="200" border="0" align="center" cellpadding="0" cellspacing="0">
<tr>
<td><div align="center"></div></td>
<td> </td>
<td><div align="center"></div></td>
<td> </td>
<td><div align="center"></div></td>
<td> </td>
</tr>
<tr>
<td><div align="center" class="style12">Jessica, very dear and near </div></td>
<td> </td>
<td><div align="center" class="style12">My Tux for Prom </div></td>
<td> </td>
<td><div align="center" class="style12">Hopefully the End result for my 63' </div></td>
<td> </td>
</tr>
<tr>
<td><div align="center"></div></td>
<td> </td>
<td><div align="center"></div></td>
<td> </td>
<td><div align="center"></div></td>
<td> </td>
</tr>
<tr>
<td></td>
<td> </td>
<td></td>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td><div align="center" class="style12">Missy at my Homecoming</div></td>
<td> </td>
<td><div align="center" class="style12"> Good Band </div></td>
<td> </td>
<td><div align="center" class="style12">Better Band </div></td>
<td> </td>
</tr>
<tr>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td></td>
<td> </td>
<td></td>
<td> </td>
<td></td>
<td> </td>
</tr>
<tr>
<td><div align="center" class="style12">Josh aka Hot pockets</div></td>
<td> </td>
<td><div align="center" class="style12">Buddy Buddy Ryan</div></td>
<td> </td>
<td><div align="center" class="style12">ME</div></td>
<td> </td>
</tr>
</table>
<div align="right" class="style12"></div>
<div align="right" class="style12"></div>
<div align="right" class="style12"></div> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>

<tr>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td width="446"> </td>
<td colspan="5"> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td colspan="5"> </td>
<td> </td>
</tr>
<tr>
<td colspan="13"></td>
</tr>
<tr>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td colspan="5"> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td>Want a Myspace Like this? </td>
<td> </td>
<td>Profile by Greensystemsgo Himself </td>
<td colspan="5"> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td>Learn HTML/CSS and you could get one!! </td>
<td> </td>
<td> </td>
<td colspan="5"> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td colspan="5"> </td>
<td> </td>
</tr>
</table>
</body>
</html>

</td></tr></table></div>
<div style="position: relative;
height: 400px;
overflow: hidden;
border: 0px;">
<table><tr><td><table><tr><td>
<div class="commentbox">
<center>Add Comment / View All<br />
<form method="post"
action="http://comments.myspace.com/index.cfm?fuseaction=user.ConfirmComment">
<input type="hidden" name="friendID" value="4f364b8a-d117-40c5-9793-b7b4ff26ce32">
<textarea name="f_comments" cols="25" rows="5"></textarea><br />
<input type="submit" value="Post">
</form>
</center>
</div>

If at first you dont suceed in opening a computer, get a hammer and a chisel like i do...

Report Offensive Message For Removal

Response Number 1

Name: Michael J (by mjdamato)
Date: April 12, 2007 at 13:47:20 Pacific
Subject: div overlay help

Reply: (edit)

I would like to make the layer centered.
Create a "master" div that has a width of 100%, then put a container div inside it with these attributes:
margin-left: auto;
margin-right: auto;
I want the layer's top edge rounded, so i made 2 rounded pictures, but they sink down.
I have no idea what you mean by "sink down". Put the images in the container div with relative positions to fit them into the corners. If it still doesn't work you may need to try giving them a higher index in the layer attributes.
lastly, i want the table to be locked at 800px diameter
A rectangle does not have a diameter - circles do. i am assuming you mean a width of 800. Give the container div, decribed above, a width of 800px.

Michael J

Report Offensive Follow Up For Removal


Guestbook help! div tags in html HELP! Things get outta postion! Help with div layers and background div tag	Div tag php wont work in hidden div Javascript, div, visibility, and IE Newbie Help! Flash vs Dreamweaver? AJAX Problem: Loading Page into Div