Help - Search - Members - Calendar
Full Version: Attempting to make Div overlay layout...
Forums > Resource Center > Support Center > MySpace Support > Myspace Resolved Topics
Jiji
Ciaosuu, again!

I've been browsing around the CB tutorials, but I wasn't able to catch up on anything that concerned with making an actual div overlay layout. This would be the first layout I have tried to make, however I am already at a sort of loss of what correct coding to use, as well as how to give it the right look.

Here, is the picture which I wish to place on top of my text boxes and navigational buttons.

The Pic


Katsby is my profile name, and this what I have done so far.


And this, being my attempt to add my 'about me' on the bottom, as well as navigational buttons at the left side: adding the bottom


Sorry, this post seems somewhat demanding...but even suggestions would help me out, at the most!
tokyo-rose
It's a pinned topic in MySpace Support. http://www.createblog.com/forums/index.php?showtopic=142922

Your Photobucket links don't lead to images. Also, you can make them show up as images in your post by using these tags:

CODE
[img]urlhere[/img]

But if they're really wide and stretch the board, use these:

CODE
[thumb]urlhere[/thumb]
vintage-toile
let me know when you've sorted out your links so i can help you properly but..
firstly you need to decide on a theme.
look at other CB layouts and read their coding to get a feel for what they've done.
you need to hide your entire myspace first, which im guessing youve done. (if not...really, dont try div layouting thumbsup.gif )
so once this is done, begin the general layout settings:
CODE
body {
background-color:COLOUR !important;
font-weight:normal;
scrollbar-face-color:transparent;
scrollbar-track-color:transparent;
scrollbar-arrow-color:transparent;
scrollbar-highlight-color:transparent;
scrollbar-3dlight-color:transparent;
scrollbar-shadow-color:transparent;
scrollbar-darkshadow-color:transparent;
}

okay. so the code above is what goes inbetween your style tags (obviously) and beneath all your default layout hiding. its generaly obvious as to what its about, background colour and scrollbar colour.
you can add in a background URL part if you like as well. set that to fixed.

CODE
a:link, a:visited, a:active, a:hover, {
font-family:times new roman;
font-size:10px;
font-weight:none;
color:COLOUR;
text-decoration:none;
}

place this directly beneath the coding before. this basically determines your links. you can seperate the a:link and copy and paste the rest of the code if you want different colours for different link-types. but stick with this for now as a beginner.

okay now for layers.

CODE
.NAME OF STYLE TAG HERE {
position:absolute;
allign:center;
overflow:none;
top:200px;
left:240px;
background-color:transparant;
font-family:times new roman;
color:TEXT COLOUR HERE.;
font-weight:normal;
height:30px;
width:400px;
margin:0;
padding:0;
}


top is how far from the top of the page the layer is, and left is how far to the left it is.
top should always be higher then 100px, or it will block out the myspace ad and this is very illegal stubborn.gif
so play about with those. height and width, again change to suit the sizes.
keep the position to absolute.

repeat this coding but changing the name of the style tag.

now in i'd like to meet. you need to complete the coding:

CODE
<div class="navi">
yep. this is real easy isn't it *sweat*
</div>


again, copy and paste but change the text inbetween the class tags to match the one you chose for that layer in your about me coding.

this is very very very basic. and as i can't see what you've done i dont know what you've done.
but please do PM me if you want anymore details.
and get those links working for some proper help thumbsup.gif
This is a "lo-fi" version of our main content. To view the full version with more information, formatting and images, please click here.