Log In · Register

 
Div overlay layout HELP, trying this again
Mirari
post Aug 31 2008, 04:33 PM
Post #1


Member
**

Group: Member
Posts: 21
Joined: Jan 2008
Member No: 608,637
CODE
<style>
table table div form {display:inline !important;}
.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}
a.text,table div font a,table div div,.navbar font,tr td font{visibility:hidden;display:none;height:0px;!important;}
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;}
table div div{visibility:hidden;!important;}
table table table table,table table table table td.text, td.text td.text table{display:none;}
body div div form {display:none !important;}td td embed, td td embed, td td object{position:absolute;top:0px;right:0px;width:45px;}div div div select {position:absolute !important; margin-left:-1000px !important; left:0px !important; display:none !important; }div div table div {display:none;} div form, .mslogo, div ul {display:none!important;}
div div, div td {background-color:transparent; background-image:none!important;}
div.profileWidth {margin-top: -30px !important;}div.profileWidth div {filter:alpha(opacity=0); opacity:0.0001}div.profileWidth div.clearfix, i i i,
div.profileWidth div div {filter:none; opacity:0.9999}div.profileWidth div.clearfix {position:relative; top:30px}
div div select, div div form {display:none !important;}</style>
<style>

.div{
position: absolute;
left: 50%;
margin-left:-400px;
top: 165px;
z-index: 0;}

.one{
position: absolute;
left: 50%;
margin-left:-400px;
top: 165px;
z-index:5;
width: 300px;
height: 126px;
overflow: auto;}

.two{
position: absolute;
left: 50%;
margin-left:0px;
top: 0px;
z-index:5;
width: 136px;
height: 454px;
overflow: auto;}</style>



<div class="div">
<img src="http://img368.imageshack.us/img368/1037/princesswitch51dj6.jpg" />

</div>

<div class="one"><center>BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH
</center>
</div>





<div class="two">

<a href="http://www.msplinks.com/MDFodHRwOi8vY29tbWVudC5teXNwYWNlLmNvbS9pbmRleC5jZm0/ZnVzZWFjdGlvbj11c2VyLnZpZXdDb21tZW50cyZmcmllbmRJRD1YWFhYWFg=">comment </a>

<a href="http://www.msplinks.com/MDFodHRwOi8vYmxvZy5teXNwYWNlLmNvbS9pbmRleC5jZm0/ZnVzZWFjdGlvbj1ibG9nLkxpc3RBbGwmZnJpZW5kSUQ9WFhYWFhY">blog </a>

<a href="http://www.msplinks.com/MDFodHRwOi8vdmlld21vcmVwaWNzLm15c3BhY2UuY29tL2luZGV4LmNmbT9mdXNlYWN0aW9uPXVzZXIu
mlld1BpY3R1cmUmZnJpZW5kSUQ9WFhYWFhY">pics </a>

<a href="http://www.msplinks.com/MDFodHRwOi8vbWVzc2FnaW5nLm15c3BhY2UuY29tL2luZGV4LmNmbT9mdXNlYWN0aW9uPWludml0ZS5h
GRmcmllbmRfdmVyaWZ5JmZyaWVuZElEPVhYWFhYWA==">add </a>

<a href="http://www.msplinks.com/MDFodHRwOi8vaG9tZS5teXNwYWNlLmNvbS9pbmRleC5jZm0/ZnVzZWFjdGlvbj11c2VyJk15VG9rZW49MWJmZGQ1Y2QtOWMxZC00NmZhLTgzYzQtN2YzMGUwZmUzZmZh">home </a>

<a href="http://www.msplinks.com/MDFodHRwOi8vbWVzc2FnaW5nLm15c3BhY2UuY29tL2luZGV4LmNmbT9mdXNlYWN0aW9uPW1haWwubWVz
2FnZSZmcmllbmRJRD1YWFhYWFgmTXlUb2tlbj02MDA3M2FmNS1lOTI5LTRjN2EtYjM1Ny0zZjFiNmRhM
JiZmI=">message </a>

<a href="http://www.msplinks.com/MDFodHRwOi8vaG9tZS5teXNwYWNlLmNvbS9Nb2R1bGVzL1ZpZXdGcmllbmRzL0ZyaWVuZHNWaWV3LmFz
Hg/ZnJpZW5kSUQ9WFhYWFhY">friends </a>

<a href="http://www.msplinks.com/MDFodHRwOi8vZnJpZW5kcy5teXNwYWNlLmNvbS9pbmRleC5jZm0/ZnVzZWFjdGlvbj1ibG9jay5ibG9ja1VzZXImdXNlcklEPVhYWFhYWA==">block </a><center>

</center>
</div>




I'm trying to create a layout and .... it isn't working. I think these codes arn't right. Anyway I can't get the boxes right. I personally think I'm needing to get photoshop before I do anything...

How do I get a layout like this ---> http://www.createblog.com/layouts/preview.php?id=30869
 
 
 Start new topic
Replies (1 - 14)
nikx618
post Aug 31 2008, 04:46 PM
Post #2


asdfghjkl;
******

Group: Official Designer
Posts: 1,121
Joined: Jul 2008
Member No: 665,416
A link to your profile would help. What do you mean you can't get the boxes right? Like, the position?
Please specify. Also, What do you mean a layout like that?
That's not really a question. Please be specific on what you would like to do/learn how to do.
&"get" you want to make one similar to it? or add it to your profile?
Please be more specific.
 
schizo
post Aug 31 2008, 04:48 PM
Post #3


Senior Member
******

Group: Staff Alumni
Posts: 2,435
Joined: Feb 2007
Member No: 506,205
Your codes look fine to me. Could you give us a link to what it looks like and tell us specifically what's wrong?

You don't necessarily need Photoshop to make layouts. Photoshop has nothing to do with coding.
 
nikx618
post Aug 31 2008, 04:49 PM
Post #4


asdfghjkl;
******

Group: Official Designer
Posts: 1,121
Joined: Jul 2008
Member No: 665,416
^yeah, you could even use paint, i've seen some people make amazing things on paint. lol
 
Mirari
post Aug 31 2008, 05:33 PM
Post #5


Member
**

Group: Member
Posts: 21
Joined: Jan 2008
Member No: 608,637
QUOTE(nikx618 @ Aug 31 2008, 05:46 PM) *
A link to your profile would help. What do you mean you can't get the boxes right? Like, the position?
Please specify. Also, What do you mean a layout like that?
That's not really a question. Please be specific on what you would like to do/learn how to do.
&"get" you want to make one similar to it? or add it to your profile?
Please be more specific.



http://www.myspace.com/nahoko


I can't get another box to show up. I don't even get why there is no navigation area or comment box area and the main area where I write whatever.. I want it my creation to look simular to it. How do I use paintshop or whatever to create a banner?
 
Smarmosaur
post Aug 31 2008, 05:40 PM
Post #6


AKA RockIt Studios
******

Group: Official Member
Posts: 2,286
Joined: Jun 2006
Member No: 421,809
to add another box, all you have to do is add another DIV, like your existing one, except maybe change the name to "three":

CODE
<style>
.three{
position:absolute;
top:##px;
left:##px;
width:##px;
height##px;
overflow:auto;}
</style>
<div class="three"><center>BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH
</center>
</div>



making a banner depends on what program you use, what you want, etc. find a program, then google for any specific effects you want to make. :]
 
Mirari
post Aug 31 2008, 05:55 PM
Post #7


Member
**

Group: Member
Posts: 21
Joined: Jan 2008
Member No: 608,637
QUOTE(RockItStudios @ Aug 31 2008, 06:40 PM) *
to add another box, all you have to do is add another DIV, like your existing one, except maybe change the name to "three":

CODE
<style>
.three{
position:absolute;
top:##px;
left:##px;
width:##px;
height##px;
overflow:auto;}
</style>
<div class="three"><center>BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH
</center>
</div>

making a banner depends on what program you use, what you want, etc. find a program, then google for any specific effects you want to make. :]



The box isn't showing up. I don't where in my codes to add the box.
 
Smarmosaur
post Aug 31 2008, 06:57 PM
Post #8


AKA RockIt Studios
******

Group: Official Member
Posts: 2,286
Joined: Jun 2006
Member No: 421,809
you need to change the CSS I gave to position it/set the width and height. since you've already created a box, I thought you would know to do that...
 
Mirari
post Aug 31 2008, 07:10 PM
Post #9


Member
**

Group: Member
Posts: 21
Joined: Jan 2008
Member No: 608,637
QUOTE(RockItStudios @ Aug 31 2008, 07:57 PM) *
you need to change the CSS I gave to position it/set the width and height. since you've already created a box, I thought you would know to do that...



I did change the width and heigth.

CODE
.three{
position:absolute;
top:0px;
left:50px;
width:136px;
height454px;
overflow:auto;}
</style>
<div class="three"><center>BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH BLAH
</center>
</div>
 
Smarmosaur
post Aug 31 2008, 07:49 PM
Post #10


AKA RockIt Studios
******

Group: Official Member
Posts: 2,286
Joined: Jun 2006
Member No: 421,809
ok. you either need to add in the CSS for "three" with the rest, or you need to add <style> before the code you just posted.
 
kristie7
post Aug 31 2008, 08:54 PM
Post #11


Senior Member
***

Group: Member
Posts: 67
Joined: May 2007
Member No: 525,594
Your boxes are not on the layout you need play with the Top and Left in order to position them correctly.

You can look up Photoshop Tutorials.
 
Mirari
post Aug 31 2008, 11:16 PM
Post #12


Member
**

Group: Member
Posts: 21
Joined: Jan 2008
Member No: 608,637
QUOTE(RockItStudios @ Aug 31 2008, 07:57 PM) *
you need to change the CSS I gave to position it/set the width and height. since you've already created a box, I thought you would know to do that...



I'm having trouble making a banner or whatever the main picture of my layout is. I can't use photoshop...
 
Smarmosaur
post Aug 31 2008, 11:58 PM
Post #13


AKA RockIt Studios
******

Group: Official Member
Posts: 2,286
Joined: Jun 2006
Member No: 421,809
there are many photoshop alternatives out there. if you don't want to download anything, you can use splashup. if you're willing to download, you can use gimp.
all you have to do is google for tutorials for whatever program you're using. or there are even tutorials here for gimp.

we can't give you step by step instructions on how to make whatever you want. you have to use your own skill and creativity. also, saying you're "having trouble" doesn't give us much to work with.
 
Mickey
post Sep 1 2008, 11:07 AM
Post #14


Treasure Pleasure
********

Group: Head Staff
Posts: 11,193
Joined: Oct 2005
Member No: 281,127
Yeah, use the CSS code RockItStudios provided and use that class for the DIV code. It should look like this:

CODE
<div class="three">BLAH BLAH BLAH</div>

Also, if you don't want to make your own banner, you can have someone make one for you but you'll need to have 25 posts under your belt to make a request. Click here if you'd like to do that.
 
Mirari
post Sep 3 2008, 07:50 PM
Post #15


Member
**

Group: Member
Posts: 21
Joined: Jan 2008
Member No: 608,637
QUOTE(RockItStudios @ Sep 1 2008, 12:58 AM) *
there are many photoshop alternatives out there. if you don't want to download anything, you can use splashup. if you're willing to download, you can use gimp.
all you have to do is google for tutorials for whatever program you're using. or there are even tutorials here for gimp.

we can't give you step by step instructions on how to make whatever you want. you have to use your own skill and creativity. also, saying you're "having trouble" doesn't give us much to work with.



I tryed using GIMP before but I just don't get the layering thing. Something about you have to haVE DIFFERENT POSITIONS OF THAT SAME PIC. I don't know how to change the main backround color, or make the navigation area or the comment box.
 
« Next Oldest · Myspace Resolved Topics · Next Newest »
 

Closed TopicStart new topic
1 User(s) are reading this topic (1 Guests and 0 Anonymous Users)
0 Members:

 

Display Mode: Switch to: Standard · Linear+ · Switch to: Outline

Track this topic · Email this topic · Print this topic