MySpace Divs

  • CGFX
  • Graduate
  • Graduate
  • User avatar
  • Posts: 161
  • Loc: Chicago, IL.

Post 3+ Months Ago

ALL,

Sorry if this is an old question, if so, please point me to the correct post.

I am new to css and mostly how it works on MySpace. I have made div overlays but do not know add image links that can be clicked to a new url.
Also how do you add text to divs in MySpace, I used h2 an p elements and they are not working, the MySpace div code is below:

.div2{
position:absolute;
top:173px;
left:40%;
margin-left:-100px;
width:300px;
height:300px;
z-index:3;
padding:0px;
border:15px solid yellow;
background-color:4a4a4a;
<h2>This is a test</h2>

Do I have to build some sort of table/container to house linkable images/text/and swf files? I am sure it's simple, again I'm new.

Thank you in advance,
cgfX
  • Anonymous
  • Bot
  • No Avatar
  • Posts: ?
  • Loc: Ozzuland
  • Status: Online

Post 3+ Months Ago

  • digitalMedia
  • a.k.a. dM
  • Genius
  • User avatar
  • Posts: 5149
  • Loc: SC-USA

Post 3+ Months Ago

If you're going to do MySpace CSS customization by hand, you need to go through the mark up and use the established heirarchy of parent/child elements.

If you want to add graphics, links, etc., you just insert the markup, or CSS, into the About Me section. For instance, go to the control panel, edit "About Me" and insert...

Code: [ Select ]
<a href="yourlink" target="_blank"><img src="yourimage"></a>
  • CGFX
  • Graduate
  • Graduate
  • User avatar
  • Posts: 161
  • Loc: Chicago, IL.

Post 3+ Months Ago

digitalMedia,

Thank you for your help, maybe it is something I am not understang, if you go to the page I am building: http://www.myspace.com/dianeandtroy

You will see a div with a thick yellow borders, that is the div code above.
I want to put a linkable image or text or swf INSIDE of that yellow border.

Say if you had a photo of yourself that you wanted to place inside of the box with the yellow borders, and then link that photo to your home site, how would you do that? Does the code you sent me need to be placed within the above .div2 {} curly brackets?

Thanks
  • digitalMedia
  • a.k.a. dM
  • Genius
  • User avatar
  • Posts: 5149
  • Loc: SC-USA

Post 3+ Months Ago

Ah, no...The CSS and the markup are separate. The ".div2{}" is the style definition (CSS). You'll want to insert the code I posted wherever you've put...
Code: [ Select ]
<div class="div2"></div>

So, it would look like this...
Code: [ Select ]
<div class="div2"><a href="yourlink" target="_blank"><img src="yourimage"></a></div>
  • CGFX
  • Graduate
  • Graduate
  • User avatar
  • Posts: 161
  • Loc: Chicago, IL.

Post 3+ Months Ago

digitalMedia,

Thank you a second time, now I believe I need you once more.

**Below Is How I Added The Code**

<style type="text/css">
.div1{
position:absolute;
top:170px;
left:50%;
margin-left:-400px;
width:800px;
height:600px;
z-index:3;
padding:0px;
border:7px solid blue;
border-style:none;
background-color:F7E0FF;
}

.div2{
position:absolute;
top:173px;
left:40%;
margin-left:-100px;
width:300px;
height:300px;
z-index:3;
padding:0px;
border:15px solid yellow;
background-color:4a4a4a;
background-color:4a4a4a;
<h2>This is a test</h2>
}


.v3{
position:absolute;
top:125px;
left:50%;
margin-left:-400px;
width:293px;
height:400px;
z-index:3;
padding:0px;
border:10px solid red;
background-color:4a4a4a;
}

.v4{
position:absolute;
top:243px;
left:78%;
margin-left:-100px;
width:200px;
height:500px;
z-index:3;
padding:0px;
border:5px solid green;
background-color:3a3a3a;
}





.contactTable{display:none;}

table table embed{position:absolute; top:148px; left:50%; margin-left:-400px;}

.blankslate{
position:absolute;
top:173px;
left:50%;
margin-left:-400px;
width:800px;
height:660px;
z-index:2;
padding:0px;
border:0px solid black;
background-color:F7E0FF;
}

.comments{
position:absolute;
top:833px;
left:50%;
margin-left:-400px;
width:800px;
z-index:3;
padding:0px;
border:0px solid black;
background-color:F7E0FF;
}


td.text td.text table .orangetext15{display:none;}
td.text td.text table table table{width:3px;}
td.text td.text table br{display:none}
td.text td.text .redlink,
td.text td.text span.btext {width:auto;}
td.text td.text table {background-color:transparent;}
td.text td.text table td,
td.text td.text table {width:700px;padding:0;border:0;}
td.text td.text table table td {padding:3;background-color:F7E0FF; border:0px solid black;}
td.text td.text table table br {display:inline;}
.redtext{color:ghostwhite;}
.blacktext10{color:solid red;}

.x{This defines the background of the entire page.}
body {
background-color:9900CC;
background-image:url('If you want a background behind your tables, place the url here!');
background-position:bottom left;
background-repeat:repeat; background-attachment:fixed;
border-width:0px;
border-color:black;
border-style:solid;
}
.x{This defines the tables.}
table table table {
background-image:url('If you put an image here, it will appear in all of your tables.');
background-color:F7E0FF;
border:2px solid black;
}

.x{This section defines the text.}
td,
.whitetext12,
.lightbluetext8,
.blacktext12,
.btext,
.text,
.orangetext15,
.nametext,
.redbtext,
.redtext,
A:link,
A:visited,
A:active,
a.redlink:link,
a.redlink:active,
a.redlink:visited,
a.searchlinksmall:link,
a.searchlinksmall:active,
a.searchlinksmall:visited,
a.searchlinksmall:hover,
a.font,
table td div div font,
div table tr td font
{
font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
font-size:8pt;
color:FF9900;
}

a.navbar,
a.navbar:link,
a.navbar:active,
a.navbar:visited{
font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
font-size:8.5pt;
color:FF9900;
}
a.navbar:hover{
font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
font-size:9pt;
font-weight: bolder;
color:FFCA7A;
}
a.redlink:hover,
A:hover{
font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
font-size:8pt; text-decoration:none;
color:88bbff;
}

.x{Comment Text; makes it look neater.}
.blacktext10 {
color:F7E0FF;
font-size:8pt;
font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
border:3px;
border-style: double;
border-top:2px 9900FF;
display:block;
width:500px;
background-color:F7E0FF;
}


.x{You shouldn't change anything past here unless you know what you're doing.}
input {background-color:white;}
img{border:0px}

table, tr, td {background:F7E0FF;border:0px;}
table table table table {border:0px;}
table table td.text table, table table td.text table td {width:100%;}
table table table table div {width:298px;}


td.text td.text table table table td a img {width:100px;}
td.text td.text table table table td div img {width:80px;}
td.text td.text table table td img {width:260px; max-width:260px; width:auto;}
td.text td.text table table td div img {width:80px;}
* html td.text td.text table table td img {width:100px;}
* html td.text td.text table table td a img {width:80px;}
* html td.text td.text table table td div img {width:80px;}

</style>

<div class="div2"><a href="http://www.dianeandtroy.com" target="_blank"><img src="http://dianeandtroy.com/images/diane_troy_DC.jpg"></a></div>



As you see, I added your code below the style sheet code, also I added above the style sheet and inside the style sheet in many spots, and nothing worked for me. All of that is in the "About Me" box on MySpace.

In the "I'd Like to Meet" box, I have the below code.

<div class="blankslate"></div>



<div class="div1"></div>

<div class="div2"></div>

<div class="div3"></div>

<div class="div4"></div>
<div class="comments" align="center"><table><tr><td><table><tr><td>

Where I'm I going wrong?

Thanks again,

cgfX
  • digitalMedia
  • a.k.a. dM
  • Genius
  • User avatar
  • Posts: 5149
  • Loc: SC-USA

Post 3+ Months Ago

Let's see here...

Code: [ Select ]
<style type="text/css">
...
.div2{
...
<h2>This is a test</h2>
}
...
</style>
  1. <style type="text/css">
  2. ...
  3. .div2{
  4. ...
  5. <h2>This is a test</h2>
  6. }
  7. ...
  8. </style>


The <h2> above shouldn't be in your style definitions. You can just remove that tag.

Code: [ Select ]
<div class="div2"><a href="http://www.dianeandtroy.com" target="_blank"><img src="http://dianeandtroy.com/images/diane_troy_DC.jpg"></a></div>


The above is correct, but that is what you should have in your "I'd like to meet" box, not just an empty DIV.

Hope that helps. Don't hesitate to keep coming back. :)
  • CGFX
  • Graduate
  • Graduate
  • User avatar
  • Posts: 161
  • Loc: Chicago, IL.

Post 3+ Months Ago

digitalMedia,

Thank you - Thank you - Thank you - Thank you - Thank you!
You are like my new best friend, I can't tell you how much drama this has gave me, and how greatful I am for your time and help. I have it working now and fully understand what I need to do.

Thank you -
  • digitalMedia
  • a.k.a. dM
  • Genius
  • User avatar
  • Posts: 5149
  • Loc: SC-USA

Post 3+ Months Ago

CGFX wrote:
digitalMedia,

Thank you - Thank you - Thank you - Thank you - Thank you!
You are like my new best friend, I can't tell you how much drama this has gave me, and how greatful I am for your time and help. I have it working now and fully understand what I need to do.

Thank you -


You are welcome, friend. :)

Post Information

  • Total Posts in this topic: 8 posts
  • Users browsing this forum: No registered users and 36 guests
  • You cannot post new topics in this forum
  • You cannot reply to topics in this forum
  • You cannot edit your posts in this forum
  • You cannot delete your posts in this forum
  • You cannot post attachments in this forum
 
 

© 1998-2014. Ozzu® is a registered trademark of Unmelted, LLC.