DIV Help please Options

[UnderageParty]

So, i have got my div working and everything its just now i want to add text. But i guess i need to "Position the text over top of the image?" Not sure but here my page. theres a big black blank spot twords the right. thats where i want the text to go...

myspace.com/familyforce5liker

[vintage-toile]

well, on my IE (latest version), the image is all cut up..so you would appear to have used mutiple images to create the div, and somehow it is now very, very distorted! so sort that out before anything else.

then you need to create a new layer, and position it as you have done with the other DIV layers for image.
create a new style in the "i'd like to meet" section.
and just type the text inbetween those style tags.

i thought you might know how to do that anyway as you've managed to create a DIV, but if you need the codes just ask.

[UnderageParty]

Well, im using Firefox. And it looks perfectly fine to me. And yes i did use multiple pictures to create this.

And i would be more then happy if you would give me the codes :)

[UnderageParty]

oh and heres the code in my "Who id like to meet" section

CODE

<div class="Parent" style="margin-left: -425px; margin-top: -110px; width: 850px; height:800px;">
<center>
<table id="Table_01" width="800" height="800" border="0" cellpadding="0" cellspacing="0">
<tr>
<td colspan="9">
<img src="http://i258.photobucket.com/albums/hh275/FaggotBitch/Ice-Storm-layout-1_01.gif" width="800" height="42" alt=""></td>
</tr>

<tr>
<td rowspan="2">
<img src="http://i258.photobucket.com/albums/hh275/FaggotBitch/Ice-Storm-layout-1_02.gif" width="126" height="758" alt=""></td>
<td>
<a href="http://www.msplinks.com/MDFodHRwOi8vY29tbWVudC5teXNwYWNlLmNvbS9pbmRleC5jZm0/ZnVzZWFjdGlvbj11c2VyLnZpZXdQcm9maWxlX2NvbW1lbnRGb3JtJmZyaWVuZElEPTU4NzQ4NDE1Jk15
G9rZW49N2NjYWU4YzYtOWFlMi00NWM3LWFlZjktODA1ZGY5MmRjYWVi">
<img src="http://i258.photobucket.com/albums/hh275/FaggotBitch/Ice-Storm-layout-1_03.gif" width="130" height="41" border="0" alt=""></a></td>
<td rowspan="2">
<img src="http://i258.photobucket.com/albums/hh275/FaggotBitch/Ice-Storm-layout-1_04.gif" width="24" height="758" alt=""></td>
<td>

<a href="http://www.msplinks.com/MDFodHRwOi8vbWVzc2FnaW5nLm15c3BhY2UuY29tL2luZGV4LmNmbT9mdXNlYWN0aW9uPW1haWwubWVz
2FnZSZmcmllbmRJRD01ODc0ODQxNSZNeVRva2VuPTNhNTlhYmM4LWJlYzAtNGRiMS04NjExLTdhNzAwM
JhMjM4Mw==">
<img src="http://i258.photobucket.com/albums/hh275/FaggotBitch/Ice-Storm-layout-1_05.gif" width="126" height="41" border="0" alt=""></a></td>
<td rowspan="2">
<img src="http://i258.photobucket.com/albums/hh275/FaggotBitch/Ice-Storm-layout-1_06.gif" width="43" height="758" alt=""></td>
<td>
<a href="http://www.msplinks.com/MDFodHRwOi8vdmlld21vcmVwaWNzLm15c3BhY2UuY29tL2luZGV4LmNmbT9mdXNlYWN0aW9uPXVzZXIu
mlld0FsYnVtcyZmcmllbmRJRD01ODc0ODQxNQ==">
<img src="http://i258.photobucket.com/albums/hh275/FaggotBitch/Ice-Storm-layout-1_07.gif" width="113" height="41" border="0" alt=""></a></td>
<td rowspan="2">
<img src="http://i258.photobucket.com/albums/hh275/FaggotBitch/Ice-Storm-layout-1_08.gif" width="37" height="758" alt=""></td>

<td>
<a href="http://www.msplinks.com/MDFodHRwOi8vbWVzc2FnaW5nLm15c3BhY2UuY29tL2luZGV4LmNmbT9mdXNlYWN0aW9uPWludml0ZS5h
GRmcmllbmRfdmVyaWZ5JmZyaWVuZElEPTU4NzQ4NDE1">
<img src="http://i258.photobucket.com/albums/hh275/FaggotBitch/Ice-Storm-layout-1_09.jpg" width="59" height="41" border="0" alt=""></a></td>
<td rowspan="2">
<img src="http://i258.photobucket.com/albums/hh275/FaggotBitch/Ice-Storm-layout-1_10.gif" width="142" height="758" alt=""></td>
</tr>
<tr>
<td>
<img src="http://i258.photobucket.com/albums/hh275/FaggotBitch/Ice-Storm-layout-1_11.gif" width="130" height="717" alt=""></td>

<td>
<img src="http://i258.photobucket.com/albums/hh275/FaggotBitch/Ice-Storm-layout-1_12.gif" width="126" height="717" alt=""></td>

<td>

<img src="http://i258.photobucket.com/albums/hh275/FaggotBitch/Ice-Storm-layout-1_13.gif" width="113" height="717" alt=""></td>
<td>
<img src="http://i258.photobucket.com/albums/hh275/FaggotBitch/Ice-Storm-layout-1_14.gif" width="59" height="717" alt=""></td>
</tr>

</table>
</center>
</div>

[Relentless]

You would need this to add in text.

CODE

<div class="content" style="position: absolute; left:#px;  top:#px; width:#px; height:#px; overflow: auto;"><center>
CONTENT FOR DIV.
</div>

With positioning help, refer to here: http://www.createblog.com/forums/index.php?showtopic=142922

[UnderageParty]

Okay, well i made my WHOLE layout with Photoshop. and i sliced it and such. And i have to upload the images that were sliced individually. And piece them together. Using that code you gave me over and over. Which i did...

CODE

<div class="Parent" style="margin-left: -425px; margin-top: -100px; width: 850px; height:800px;">
<center>
<table id="Table_01" width="800" height="800" border="0" cellpadding="0" cellspacing="0">
<tr>
<td colspan="9">
<img src="http://i258.photobucket.com/albums/hh275/FaggotBitch/Ice-Storm-layout-1_01.gif" width="800" height="42" alt=""></td>
</tr>

<tr>
<td rowspan="2">
<img src="http://i258.photobucket.com/albums/hh275/FaggotBitch/Ice-Storm-layout-1_02.gif" width="126" height="758" alt=""></td>
<td>
<a href="http://www.msplinks.com/MDFodHRwOi8vY29tbWVudC5teXNwYWNlLmNvbS9pbmRleC5jZm0/ZnVzZWFjdGlvbj11c2VyLnZpZXdQcm9maWxlX2NvbW1lbnRGb3JtJmZyaWVuZElEPTU4NzQ4NDE1Jk15
G9rZW49N2NjYWU4YzYtOWFlMi00NWM3LWFlZjktODA1ZGY5MmRjYWVi">
<img src="http://i258.photobucket.com/albums/hh275/FaggotBitch/Ice-Storm-layout-1_03.gif" width="130" height="41" border="0" alt=""></a></td>
<td rowspan="2">
<img src="http://i258.photobucket.com/albums/hh275/FaggotBitch/Ice-Storm-layout-1_04.gif" width="24" height="758" alt=""></td>
<td>

<a href="http://www.msplinks.com/MDFodHRwOi8vbWVzc2FnaW5nLm15c3BhY2UuY29tL2luZGV4LmNmbT9mdXNlYWN0aW9uPW1haWwubWVz
2FnZSZmcmllbmRJRD01ODc0ODQxNSZNeVRva2VuPTNhNTlhYmM4LWJlYzAtNGRiMS04NjExLTdhNzAwM
JhMjM4Mw==">
<img src="http://i258.photobucket.com/albums/hh275/FaggotBitch/Ice-Storm-layout-1_05.gif" width="126" height="41" border="0" alt=""></a></td>
<td rowspan="2">
<img src="http://i258.photobucket.com/albums/hh275/FaggotBitch/Ice-Storm-layout-1_06.gif" width="43" height="758" alt=""></td>
<td>
<a href="http://www.msplinks.com/MDFodHRwOi8vdmlld21vcmVwaWNzLm15c3BhY2UuY29tL2luZGV4LmNmbT9mdXNlYWN0aW9uPXVzZXIu
mlld0FsYnVtcyZmcmllbmRJRD01ODc0ODQxNQ==">
<img src="http://i258.photobucket.com/albums/hh275/FaggotBitch/Ice-Storm-layout-1_07.gif" width="113" height="41" border="0" alt=""></a></td>
<td rowspan="2">
<img src="http://i258.photobucket.com/albums/hh275/FaggotBitch/Ice-Storm-layout-1_08.gif" width="37" height="758" alt=""></td>

<td>
<a href="http://www.msplinks.com/MDFodHRwOi8vbWVzc2FnaW5nLm15c3BhY2UuY29tL2luZGV4LmNmbT9mdXNlYWN0aW9uPWludml0ZS5h
GRmcmllbmRfdmVyaWZ5JmZyaWVuZElEPTU4NzQ4NDE1">
<img src="http://i258.photobucket.com/albums/hh275/FaggotBitch/Ice-Storm-layout-1_09.jpg" width="59" height="41" border="0" alt=""></a></td>
<td rowspan="2">
<img src="http://i258.photobucket.com/albums/hh275/FaggotBitch/Ice-Storm-layout-1_10.gif" width="142" height="758" alt=""></td>
</tr>
<tr>
<td>
<img src="http://i258.photobucket.com/albums/hh275/FaggotBitch/Ice-Storm-layout-1_11.gif" width="130" height="717" alt=""></td>

<td>
<img src="http://i258.photobucket.com/albums/hh275/FaggotBitch/Ice-Storm-layout-1_12.gif" width="126" height="717" alt=""></td>

<td>

<img src="http://i258.photobucket.com/albums/hh275/FaggotBitch/Ice-Storm-layout-1_13.gif" width="113" height="717" alt=""></td>
<td>
<img src="http://i258.photobucket.com/albums/hh275/FaggotBitch/Ice-Storm-layout-1_14.gif" width="59" height="717" alt=""></td>
</tr>

</table>
</center>
</div>

So...i really don't know how to add the text...
Its just confusing me alot.

[Relentless]

Well, that's correct.

You put all those image slices in a div.

Then you have to make another DIV for text.

[UnderageParty]

Okay, im glad i did that correctly.
now where would i add

CODE

<div class="content" style="position: absolute; left:#px; top:#px; width:#px; height:#px; overflow: auto;"><center>
CONTENT FOR DIV.
</div>

at?

[karmakiller]

You can add DIVs for your content right underneath your image mapped div. So right under the codes that you posted here would work fine. Is that what you're asking?

[heyo-captain-jac...]

Okay, im glad i did that correctly.
now where would i add

CODE

<div class="content" style="position: absolute; left:#px; top:#px; width:#px; height:#px; overflow: auto;"><center>
CONTENT FOR DIV.
</div>

at?

Anywhere. About me is the best though.

[UnderageParty]

so i tried doing it....But nothing showed up...
i have no clue why...
am i supposed to add a .content{Blah blah blah} in my about me section?
And then the DIV code in my who i'd like to meet section?
If so what should be put in between the { }'s?

[vintage-toile]

ah sorry for taking my time to reply.

okay, in the about me section place this somewhere:

CODE

<style>.about {
position: absolute;
overflow:auto;
top:HOW FAR DOWN FROM THE TOP OF THE PAGE YOU WANT IT (KEEP IT ABOVE 150)px;
left:KEEP ABOVE 0, HOW FAR FROM THE LEFT SIDE OF THE PAGE YOU WANT ITpx;
background-color:transparant;
font-family:FONT NAME;
font-size:SIZE OF FONTpx;
color:TEXT COLOUR;
font-weight:normal;
height:CHOOSE HEIGHT OF BOXpx;
width:CHOOSE WIDTH OF BOXpx;
margin:0;
padding:0;
}
</style>

and then in the i'd like to meet section:

CODE

<div class="about">
<center>
you can write your about me here.
</div>

do you see how it works? the .about is the tag for the DIV which is displayed in the about me coding, and then the same tag is given for the layer in the id like to meet coding.
therefore its the same box, and works out.

hopefully that helps a bit better.
NOTE - you don't always need style tags, im just putting them there so you know, if you've already got style tags in place, keep them there, scrap the ones i've put.

[UnderageParty]

Okay thank you. It works. But the thing is.... The Image DIV covers up the text....
the "slices" covers it up :\
So how would i make it so the text is over top of the text?

[UnderageParty]

^{TOPIC RESOLVED. PLEASE CLOSE}