Understanding DIVs Options

[protos]

I completely understand myspace divs. but I don't understand xanga divs. even after reading the tutorial

Is there a certain place/order the the blog div or optional content needs to be?

[talcumpowder]

Barebones example:

CODE

<img src="http://" alt="This is my main image">

<div id="navigation">
Sidebar, scrollybox, whatever. This is that extra stuff which usually goes into the modules that you just disabled. 'kay? Got it memorized?
</div>

<style type="text/css">
</style>

<div id="blog">

Now, see, that's just to show you where things go. Code for KURA!, rein.29:

CODE

<!-- image stuff -->
<div id="img" align="left"><IMG SRC="http://blewmyallowanceonmanga.net/images/dontyou_main.jpg" BORDER="0" alt="Don't you?" galleryimg="no"></div>

<!-- sidebar, yo! -->
<div id="masterdiv" align="right">
<!-- begin credits module -->
<div class="menutitle">-&gt; Credits&Disclaimer</div>
<div align="left">This layout is intended for my own <b>personal</b> use. You may not take <u>any</u> of the images, code, or text on this site without my permission. All of the images on this site were edited in Photoshop Elements 3.o by me and me alone. You may not claim you created any of the content on this site as it all belongs to me, except where noted. Credit has been given to the proper sources of certain things, so don't try to be smart and tell me I 'jocked' anything from you. I didn't. If you're lame enough to think I did, then why the hell would I jock from you?!<br>

Images are self-capped .<br>
Texture is self-made.<br>
All coding done by <a href="http://blewmyallowanceonmanga.net/">SR/Reili</a><br>
</div>
<!-- end credits module -->

<div class="menutitle">-&gt; About Me&RHF</div>
<div align="left">
<p align="center"><img src="http://blewmyallowanceonmanga.net/images/dontyou_avvie.png" alt="avatar"></p>I'm the cute little fox-girl know as SR, Reili, and sometimes (that is to say, <i>very</i> rarely) Megan. I founded the RHF community, and it has now grown into... Into... A community. Hehe, yeah. RHF stand for "<b>R</b>ed <b>H</b>air <b>F</b>etish" in case you haven't been around for long enough to know. There are currently 9 members of RHF and around 3 pending members. <i>KURA!</i> in general is a RP-blog which I write in and mantain my RHF love. I write about what happens and what I've recently done, all in a handy RP format. ^_^<br>

I'm currently 15 years old, and I <i>love</i> anime and webdesigning. I'm also really into music, and you will often see me wearing headphones. Hm... I also like pie, but that's irrelevant.<br>
You will often find me on <a href="http://www.createblog.com">CB</a>, because I love it there. It has a great atmosphere and I recently got promoted to Design staff! Hehe, I love helping out n00bs. I really do, no matter what I say.
</div>

<div class="menutitle">-&gt; Subscribe?</div>
<div align="center">
+ <a onclick="java script:window.open('/Private/SubscribeTo.aspx?user=x_KurayamixnixAkaixBara_x','subscriptions','width=470,height=455,scrollbars=1,resizable=1');return false;" href="/Private/SubscribeTo.aspx?user=x_KurayamixnixAkaixBara_x"><span id="subSubTo">Subscribe to SR!</span></a><br>

+ <a onclick="java script:window.open('/Private/SubscribeTo.aspx?trial=1&amp;user=x_KurayamixnixAkaixBara_x','subscriptions','width=470,height=455,scrollbars=1,resizable=1');return false;" href="/Private/SubscribeTo.aspx?trial=1&amp;user=x_KurayamixnixAkaixBara_x">
<span id="subTrialSubTo">Get trial subscription</span></a></div><br>
<div class="menutitle">-&gt; Your Menu</div>
<div align="left">
+ <a href="http://xanga.com">Xanga Home</a><br>
+ <a href="http://xanga.com/x_KurayamixnixAkaixBara_x">Refresh</a><br>
+ <a href="http://www.xanga.com/private/home.aspx">Your Xanga</a><br>

+ <a href="http://www.xanga.com/Private/subs.aspx">Your Subbies</a><br>
+ <a href="http://www.xanga.com/profile.aspx?user=x_KurayamixnixAkaixBara_x">Profile-ness</a><br>
+ <a href="http://www.xanga.com/guestbook.aspx?user=x_KurayamixnixAkaixBara_x">Sign the GuestBook</a><br>
{<a href="http://www.xanga.com/signin.aspx">In</a> - <a href="http://www.xanga.com/logout.aspx">Out</a> - <a href="http://www.xanga.com/CLAF/default.asp">Edit</a>}<br>

<div class="menutitle">-&gt; CB &amp; Design Stuff</div>
+ <a href="http://www.xanga.com/groups/group.aspx?id=240961&s=0">CreateBlog BlogRing</a><br>
+ <a href="http://www.createblog.com/forums/index.php?showtopic=14636">The Big Book of Resources</a><br>
+ <a href="http://www.createblog.com/forums/index.php?showforum=3">Xanger Scripts</a><br>
+ <a href="http://www.createblog.com/forums/index.php?showforum=10">Xanger Help</a><br>

+ <a href="http://www.createblog.com/forums/index.php?showforum=2">Xanger Skins</a><br>
+ <a href="http://www.createblog.com/forums/index.php?showforum=6">Xanger Showcase</a><br>
+ <a href="http://www.createblog.com/forums/index.php?showforum=75">Tutorials</a><br>
+ <a href="http://www.createblog.com/forums/index.php?showtopic=61624">Skin Tutorial</a><br>
<a href="http://www.createblog.com/topsite/in.php?id=2"><img src="http://www.createblog.com/images/top2.gif" border="0" /></a>
<br><br>
<div class="menutitle">-&gt; Contact</div>

<a href="http://foxy.blewmyallowanceonmanga.net/">foxy!</a><br>
(Please list <i>Reili</i> as your referrer!)<br>
<a href="mailto:ohSHUTUP[at]blewmyallowanceonmanga.net" alt="Email-SR">E-mail</a><br>
<a href="aim:goim?screenname=R4wr X 172 SR" ALT="IM Smothered Rose">IM</a>x
<a href="aim:goim?screenname=Megz XTC" ALT="IM Smothered Rose">IM</a>x
<a href="aim:goim?screenname=nyahxNEK0" ALT="IM Smothered Rose">IM</a><br><br>
</div>

<div class="menutitle">-> RHF Members</div>
<div align="left">
Him ~ RHF member #1, very little is known about this char.<br>
K-kun ~ SR’s tag-along, her boyfriend / best friend. RHF member #2<br>
George ~ RHF member #3, comes from G Gundam.<br>
Kenshin ~ RHF member #4, comes from Ruroni Kenshin.<br>
Ryou ~ RHF member #5, comes from Yu-Gi-Oh.<br>
Youko ~ Separate from K-kun, yet the same. RHF member #6<br>
Jin ~ RHF member #7, from YYH! ^_^u<br>

Suiichi Minamino ~ K-kun’s little bro, RHF member #8<br>
Kazuya ~ RHF member #9<br>
Gojyo ~ RHF member #10, I think...<br>
Hikaru&amp;Kaoru ~ RHF Members #11&amp;12<br>
Daisuke ~ <i>Pending member</i><br>
</div>
</div>

<style type="text/css">
/* "Boy" Band//rein.26 */
/* By - Reiri/fishcake-y @ CB[dot]Com */
/* for her personal use only! */
body {cursor: crosshair; overflow-x:none; background-color: #FFFFFF; background-color: #FFFFFF; background-image: url("http://blewmyallowanceonmanga.net/images/dontyou_bg.jpg"); background-position:  center bottom; background-repeat: repeat;}
//blogringdocument.write
.left, .blogbody, table.footer, .standard, .leftmodulefontcolor, td, p {
/* edits main text */
font: 10pt Georgia, "Times New Roman", serif; color: #000000; text-align:justify;}
div.blogheader, .caption {
/* edits the dates */
font-family: Georgia, "Times New Roman", serif; font-size: 13pt; color: #FFCCCC; text-align: right; width: 270;}
a:link, .footernav.link, a.footernav:link, a.footernav:active {
/* edits all links */
color: #FFCCCC; font: 10pt Georgia, "Times New Roman", serif; text-decoration: none;}
//blogring.document.write
a:visited, a.footernav:visited,  {
/* edits the links that the user has visited */
color: #FFCCCC; font: 10pt Georgia; text-decoration: none;}
a:hover {
/* edits when user mouseovers the links */
color:#CCCCCC; font: 10pt Georgia, "Times New Roman", serif; cursor: crosshair; text-decoration: line-through;}
input, select, textarea, .textfield, .button {
/* this edits the buttons, dropdowns, etc. */
border: 1px dashed #FFCCCC; font: 10pt Georgia, "Times New Roman", serif; background-color: #Transparent;}
table.blogbody {
/* this edits the other the place where the  blog is */
background-color: #Transparent; width: 270px;}
.leftmoduletitlebar, .leftmoduleborder, .leftmoduleinterior, table.left, table.left TH, table.left TD, table.navigation, table.footer{display: none;}
/* layout crap */
#img{left: 8px!important; margin-left: -8px; margin-top: -13px!important; margin-top: -20px;}
#masterdiv{position: static; margin-top: -325px; margin-left: 727px; width: 210px; height: 140px; overflow: auto;}
#main{position: static; margin-top: -190px; margin-left: 1085px; width: 305px; height: 355px; overflow: auto;}
div.menutitle{text-align: right; border-bottom: 1px solid #FFCCCC;}
hr {border: 1px solid #FFCCCC; width:200;}

</style>

<script>document.title="KURA!//ver.Don't You? - rein.29";</script>
<script>window.status="Don't you wish your girlfriend was hot like me?";</script>

<div id="main">

&then there's a </div> tag in webstats to end the div id'd main.

Pretty simple once you really think about it a little. &you always rough-place everything together, but when you fine-tune, always do the navigation area before the blog. Just trust me on that.

[protos]

can you have multiple extra areas for navigation stuff?

like another content section?

[talcumpowder]

Yeah, but they all go before the stylesheet.

And they all need to be closed and fine-tuned before the blog area.

[*digital.fragrance*]

^ or they can go after - that's what I did with my newer ones. The stylesheet went first, then th enavigation divs, then the last open div for the blog alignment.

however, it does work both ways :)

[talcumpowder]

That's a matter of preference.

It's easier to find all the navigation crap if it's before a certain point, so I do it like that for orginazational purposes. =3 It's also easier when you're beginning because you're liklier to remember where a specific piece of your code is.

Basically, just don't be haphazard in your coding (like one before and one after, because that'd be really confusing for another user if they had to look at your code to troubleshoot).

[protos]

do absolute and relative work the same way. On myspace, I can use Adobe Imageready to map things perfectly in absolute.

How does it work in xanga?

[talcumpowder]

The way absolute positioning should. Although it's easier to just not use positioning, because the ad tends to screw with it a little (page flow, remember?). Your margin ends up being rather negative.

If anything, I use static.

[protos]

I don't know/remember anything about static. how does that work?

[talcumpowder]

[ http://www.christian-web-masters.com/artic...al__page_1.html ]

Like relative, but better for nesting.