coding for div Options

[MoneyIsDaMotive]

CODE

<style type="text/css">
.contacttable,.whitetext12,.nametext,.lightbluetext8,.orangetext15,.blacktext12,
btext,.redtext,.redbtext{display:none;height:0px;!important;visibility:hidden}
td td td td{border:0px;width:0px;text-align:left;}
table,td,tr{padding:0px;width:;background-color:transparent}
table table table{padding:1px;height:.01%;width:100%;}
table table,table table table table,table,tr,td{height:0px;!important;border:0px;!important}
table table table table,table table table table td.text, td.text td.text table{display:none;}
td.text table table{display:inline;visibility:visible;}
table td table tr td.text table{visibility:hidden;}
table td table tr td.text table table,table td table tr td.text table table td.text{visibility:visible;}

<style type=text/css>

body {
background-color: ######;
background-image: url("");
background-position: bottom right;
background-repeat: no-repeat;
background-attachment: fixed;
scrollbar-arrow-color:######;
scrollbar-track-color: ######;
scrollbar-shadow-color: ######;
scrollbar-face-color:######;
scrollbar-highlight-color:######;
scrollbar-darkshadow-color:######;
scrollbar-3dlight-color:######;}

table, tr, td {background-color: transparent; border: 0px; padding:2;}
table table {border: 0px;}
table table table table{border: 0px;}

{The actual modules}
table table table {border: 1px solid; border-color: ######; background-color: ######; }

{sets the default style for the body, table data, list data, divisions and text areas}
body,table, td, li, p, div, textarea
{font:normal 9px arial; color:######; font-weight:none; border:0px; text-transform: none; line-height:12px;}

{class for the basic font for the page}
.text {font:normal 9px arial; color:######; font-weight:none; border:0px; text-transform: none; line-height:12px;}

{2 links in very top on the left, and the 13 links above your picture with make the navigation bar}
a.navbar{font-family:arial; font-size:9px; color:######; font-weight:none;border:0px; text-transform: uppercase;}
a.navbar:link{font-family:arial; font-size:9px; color:######; font-weight:none;border:0px; text-transform: uppercase;}
a.navbar:active{font-family:arial; font-size:9px; color:######; font-weight:none;border:0px; text-transform: uppercase;}
a.navbar:visited{font-family:arial; font-size:9px; color:######; font-weight:none;border:0px; text-transform: uppercase;}
a.navbar:hover{font-family:arial; font-size:9px; color:######; font-weight:none;border:0px; text-transform: uppercase;}

{Default Links}
a:link, a.man{font-family:arial; font-size:9px; color:######; font-weight:none;border:0px; text-transform: uppercase; letter-spacing: 0px;}
a:active{font-family:arial; font-size:9px; color:######; font-weight:none;border:0px; text-transform: uppercase;}
a:visited{font-family:arial; font-size:9px; color:######; font-weight:none;border:0px; text-transform: uppercase;}
a:hover{font-family:arial; font-size:9px; color:######; font-weight:none;border:0px; text-transform: uppercase;}

{bolded words}
.standard b, p b, B, strong {
font-family:arial; font-size:9px; color:######; font-weight:none;border:0px; text-transform: uppercase; }

</style>

<div class="bg" style="position: absolute; left:0px; top:160px; width:000px; height:000px; overflow: hidden;">
<img src="http://i25.tinypic.com/33vkc5c.jpg">
</div>



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

Reason for edit: Please use [codebox] tags instead of [code] tags when posting longer codes. - Mike

[Mickey]

You need to separate the HTML and CSS codes. I suggest placing HTML codes in your About Me and CSS codes in your Who I'd Like To Meet. Therefore, your About Me should look like this:

CODE

<div class="bg" style="position: absolute; left:0%; top:50%; width:640px; height:480px; overflow: hidden;">
<img src="http://i25.tinypic.com/33vkc5c.jpg" />
</div>

Your Who I'd Like To Meet should look like this:

CODE

<style>

{hide all of myspace} .contacttable,.whitetext12,.nametext,.lightbluetext8,.orangetext15,.blacktext12,
btext,.redtext,.redbtext{display:none;height:0px;!important;visibility:hidden}
td td td td{border:0px;width:0px;text-align:left;}
table,td,tr{padding:0px;width:;background-color:transparent}
table table table{padding:1px;height:.01%;width:100%;}
table table,table table table table,table,tr,td{height:0px;!important;border:0px;!important}
table table table table,table table table table td.text, td.text td.text table{display:none;}
td.text table table{display:inline;visibility:visible;}
table td table tr td.text table{visibility:hidden;}
table td table tr td.text table table,table td table tr td.text table table td.text{visibility:visible;}


BODY {scrollbar-3dlight-color:;
scrollbar-shadow-color:;
scrollbar-face-color:;
scrollbar-darkshadow-color:;
scrollbar-track-color:;
scrollbar-arrow-color: babyblue;
scrollbar-highlight-color:;}
body { background-color: white;
{background-image:url("");
background-attachment: fixed;
background-position: bottom left;
background-repeat:repeat;}

table table table {border: 1px solid; border-color: 000000; padding:0; background-color:; background-image: url("")}

table tbody td table tbody tr td.text table{background-color: ffffff; background-image: url("")}table table{border:0px;}

table table table table{border:0px;}

table, tr, td {background-color:transparent; border:none; border-width:0;}

font, a, body, table, body, td, li, p, textarea, li, h1, h2, p, br {font-family:Georgia; font-size: 11px; color: 000000; font-weight: normal; text-decoration: none; letter-spacing: 0px; text-transform: none; padding: 0px; line-height: 10px; background-color:transparent;}

.text {font-family:Georgia; font-size: 11px; color: 000000; font-weight: normal; text-decoration: none; letter-spacing: 0px; text-transform: none; padding: 0px; line-height: 10px;}

{bolded words}
.standard b, p b, B, strong {
font-family:arial; font-size:9px; color:babyblue; font-weight:5pt;border:0px; text-transform: uppercase; }

</style>

That should make your DIVs appear.

[MoneyIsDaMotive]

wait wasnt it css on top
and html on bottem before???

[MoneyIsDaMotive]

no, well wait. i fixed the style sheet && redid it and post it and replaced the other one.like the one in the Tut.
but before i start using it, i remember that i had alot of problems the first time i coded divs. like browser and resolution.
can you make sure code won't have the same problems so i don't have to ask whats wrong later?
and please check my code to see if its all good .

[Mickey]

On here:

CODE

<div class="bg" style="position: absolute; left:0%; top:50%; width:640px; height:480px; overflow: hidden;">
<img src="http://i25.tinypic.com/33vkc5c.jpg" />
</div>

Replace the positioning attributes with this:

CODE

<div class="bg" style="position: absolute; left:50%; margin-left:#px; top:#px; width:640px; height:480px; overflow: hidden;">
<img src="http://i25.tinypic.com/33vkc5c.jpg" />
</div>

Then replace the pound symbols with appropriate values until it's where you want it.

[MoneyIsDaMotive]

okay so what does that fix?and i know i havent got to edit it yet,
but wasnt there a "_" somewhere for browsers????(underscore)

[MoneyIsDaMotive]

okay, keep this open till i figure this out which probly won't take
long if i need help, ill ask on this post or if im done ill say please close


also 1 random question to get it out the way,
if i do try to make a layout for create-blog
don't the rules say copyright can't be on the div??
you can only use links(text)????
i thought i seen that as a new rule a year ago?

[Mikeplyts]

Yeah, it doesn't matter. You just have to at least have some form of copyright on there, imo.

[MoneyIsDaMotive]

Yeah, it doesn't matter. You just have to at least have some form of copyright on there, imo.

okay so i can put the copyright on the image right????

[Mikeplyts]

sure, why not. :) I prefer to make it a DIV class though so that way the user could change it if their using it for the next year. :p

[MoneyIsDaMotive]

sure, why not. :) I prefer to make it a DIV class though so that way the user could change it if their using it for the next year. :p

what you mean by div class?

[MoneyIsDaMotive]

ohhhh yeah i see.
i probly won't do that.
why would you do that anyways when
any one can steal your layout??

[MoneyIsDaMotive]

^ Anyone can edit the copyright out of the image, too.

yeah your right.
onless you make it blend in the image......

[MoneyIsDaMotive]

yeahh ill tell you 2night


wasnt their a code for the bottem links to go down the page???

-edit. oops i didn't mean to double post.mybad

Reason for edit: Please use the Edit button instead of double-posting. - Mike

[Mickey]

Posts merged.

[MoneyIsDaMotive]

nope im good,
i got the image on, well positioned in the center
(i think)
now what i need to do is get the two tables in the right
place and
wait.
i remember how i use to make the links, i just don't
remember the code.
on photoshop, the image info. theres a X and Y,
then you copy (i think)the numbers on the corners of like "message add comment"
i forgot the code tho
help me out




also.
this is kinda hard to do sence theres no boarder

here.

how can i puta boarder around it?
the box is on the top left corner

[MoneyIsDaMotive]

thats harder what i did before
can you try and find the other code
for i can use photoshop with
this is how it went (i think)

i had to pick (in the info panel) pixals on the +
where the X and Y is. then i had to use the pointer tool
to all for corners of the "message, add, comment"
wait is that the code you just gave me?? i remember the "alt"
but if its not, can you try and find it for me

[MoneyIsDaMotive]

no i don't think it had pound symbols in it,
and image mapping?wait i think it was that????
rawr
okay well if IT is image mapping(i think if was too )

can you explane your code a lil bit more

[Mickey]

An image map code looks something like this:

CODE

<map name="business">
<area shape="rect" coords="#, #, #, #" href="URL">
<area shape="rect" coords="#, #, #, #" href="URL">
<area shape="rect" coords="#, #, #, #" href="URL">
<area shape="rect" coords="#, #, #, #" href="URL">
<area shape="rect" coords="#, #, #, #" href="URL">
<area shape="rect" coords="#, #, #, #" href="URL">
</map>

<img src="URL" usemap="#business" alt="" />

On the underlined bit, the usemap property uses a pound symbol to call on the map code above it. That's why it won't function right.

[MoneyIsDaMotive]

ohhh see i thought you mean something like this

http://www.createblog.com/photoshop-tutori...hop-image-maps/

and yeahh i think thats what it was.

ANYTHING to replace that????

[MoneyIsDaMotive]

okay, you said getting use to the method.what method?

[MoneyIsDaMotive]

ok well im gonna switch the divs, the 1 you gave me and fix it,
then im gonna do the links
and after that, i wanna do rollovers.

so can you explane that?

[MoneyIsDaMotive]

okay on that. post #9.

can you explane how to do that??????

[MoneyIsDaMotive]

nvm let me try and do it first, thenn if i need help ill ask

[MoneyIsDaMotive]

not yet. i had about a hour on it, i got the first table on.
take a look.
and

i had the image higher "like it is now"
before i logged off, but when i logged back in.
the image went down,
and this is the 2nd time
i fixed it tho its higher
but why did it do that?
any ideas?