Log In · Register

 
two background images working together?, i need to put an image repeating down sides, with my center overlay
brooklyneast05
post May 26 2007, 03:37 PM
Post #1


I'm Jc
********

Group: Mentor
Posts: 13,619
Joined: Jul 2006
Member No: 437,556



im making an overlay for my profile
so in the code it says

body {
background-color: 660000;
background-image: url("http://i6.photobucket.com/albums/y242/brooklyneast05/Myspace/ok.png");
background-repeat: no-repeat;
background-attachment: scroll;
background-position: top center
}


that works fine, the problem is that i want another image going down each side, repeating, with my main overlay image still in the center
im not sure where i can put the url to the side image so that it will show up.


if i put this in

body {
background-image: url(http://i6.photobucket.com/albums/y242/brooklyneast05/Myspace/Myspace_v2_by_wireless_studios.jpg) ;
background-repeat: repeat-y ;
background-position: top left;
line-height: 14px;
cursor: default;
background-color: 660000;}



i see the side image, but i no longer see my main over lay image in the center.

id appreciate any advice on what i need to do, thanks
 
 
Start new topic
Replies (1 - 11)
YourSuperior
post May 26 2007, 03:45 PM
Post #2


;)
*******

Group: Staff Alumni
Posts: 9,573
Joined: Feb 2005
Member No: 99,124



How about you put your main overlay image in image tags like this:
CODE
<img src="MAIN OVERLAY IMAGE URL HERE">
and keep your repeating background in your css like you have it up there the second time:
CODE
<style type="text/css">
body {
background-image: url("background url here");
background-repeat: repeat-y;
background-position: top left;
line-height: 14px;
cursor: default;
background-color: 660000;
}
</style>
 
brooklyneast05
post May 26 2007, 04:07 PM
Post #3


I'm Jc
********

Group: Mentor
Posts: 13,619
Joined: Jul 2006
Member No: 437,556



and i put both of these in my about me section?

just like u have it there

the first tag and then my repeating background right after it
 
YourSuperior
post May 26 2007, 04:09 PM
Post #4


;)
*******

Group: Staff Alumni
Posts: 9,573
Joined: Feb 2005
Member No: 99,124



Yeah. That should work fine.
 
brooklyneast05
post May 26 2007, 04:13 PM
Post #5


I'm Jc
********

Group: Mentor
Posts: 13,619
Joined: Jul 2006
Member No: 437,556



hmmmm
the main overlay image still doesn't show up when i do that
 
YourSuperior
post May 26 2007, 04:20 PM
Post #6


;)
*******

Group: Staff Alumni
Posts: 9,573
Joined: Feb 2005
Member No: 99,124



Can you post the link to your myspace?
 
brooklyneast05
post May 26 2007, 04:22 PM
Post #7


I'm Jc
********

Group: Mentor
Posts: 13,619
Joined: Jul 2006
Member No: 437,556



http://profile.myspace.com/index.cfm?fusea...iendid=54673599


there should be an overlay going over the top, framing the text in boxes, but if i keep the code for that wood side pannel, then it doesn't show up
 
YourSuperior
post May 26 2007, 04:29 PM
Post #8


;)
*******

Group: Staff Alumni
Posts: 9,573
Joined: Feb 2005
Member No: 99,124



Okay, paste the code below before all of your css, and use a div to move it if you need to. Because I looked through your code and you had not added the code below.

CODE
<img src="http://i6.photobucket.com/albums/y242/brooklyneast05/Myspace/ok.png">
 
brooklyneast05
post May 26 2007, 04:35 PM
Post #9


I'm Jc
********

Group: Mentor
Posts: 13,619
Joined: Jul 2006
Member No: 437,556



hmmm
well i put the code before my css code
and its still nothing

when i preview my profile, i see the overlay image, although its not where it should be, its way off to the side, but i still see it there, after i save changes and view my profile though, it doesnt show
 
YourSuperior
post May 26 2007, 04:41 PM
Post #10


;)
*******

Group: Staff Alumni
Posts: 9,573
Joined: Feb 2005
Member No: 99,124



Hmmm. Let's see. Scratch what I just told you to do and try adding this:

CODE
<style type="text/css">
.mainimage{
background-image: url('http://i6.photobucket.com/albums/y242/brooklyneast05/Myspace/ok.png');
background-attachment: fixed;
position: absolute;
overflow: none;
margin-left: ###px;
margin-top: ###px;
padding-top: 0px;
padding-bottom: 0px;
}
</style>


And add this at the end of your coding:
CODE
<div class="mainimage"></div>


Try adding that to your code ad use margin-left and margin-top to position your image.
 
brooklyneast05
post May 26 2007, 04:46 PM
Post #11


I'm Jc
********

Group: Mentor
Posts: 13,619
Joined: Jul 2006
Member No: 437,556



i put that in
at the top of my about me section

this is my about me section
CODE

<style type="text/css">
.mainimage{
background-image: url('http://i6.photobucket.com/albums/y242/brooklyneast05/Myspace/differentlayout.png');
background-attachment: fixed;
position: absolute;
overflow: none;
margin-left: 100px;
margin-top: 100px;
padding-top: 0px;
padding-bottom: 0px;
}
</style>

<style type="text/css">

.ftd {Moves the entire profile up - hey hey hey goodbye}
body table {margin-top:-5000px;}

.ftd {Keeps the ad, search form, and navigation links in place}
body td table, body div table {margin-top: 0;}

.ftd {Makes the table the ad, search form and nav links are on transparent}
table, tr, td {background-color:transparent;}

.ftd {Removes the search form}
body div table form{display:none;}

.ftd {For comment boxes to display}
body table div form{display:block;}

.ftd {Hides the dividers in between the nav links}
div table td font {visibility:hidden; }

.navbar {visibility:visible !important;}

a.navbar:active, a.navbar:visited, a.navbar:link { font-family: arial; font-size: 10px; font-weight: bold; color:7E0808; }
a.navbar:hover { color:ffffff; text-decoration: strike; }




body {
background-image: url("http://i6.photobucket.com/albums/y242/brooklyneast05/Myspace/Myspace_v2_by_wireless_studios.jpg");
background-repeat: repeat-y;
background-position: top left;
line-height: 14px;
cursor: default;
background-color: 660000;
}



.bottom {
background-color:transparent;
border: 0px solid white;
position:absolute;
left:50%;
margin-left:-25px;
top:900px;
height:100px;
width:50px;
z-index:1;
}


.links {
background-color: transparent;
border: 2px;
border-style: double;
border-color: transparent;
font-family: arial;
font-size: 11px;
color: ffffff;
position: absolute;
top: 0%;
left: 50%;
margin-left: 105px;
top: 415px;
height: 130px;
width: 272px;
overflow-y: auto;
overflow-x: auto;
z-index: 2;
}

.div1 {
background-color: transparent;
border: 4px;
border-style: double;
border-color: transparent;
font-family: arial;
position: absolute;
top: 0%;
left: 50%;
margin-left: -373px;
top: 202px;
height: 374px;
width: 286px;
overflow-y: auto;
overflow-x: hidden;
z-index: 2;
color: ffffff;
font-weight: normal;
font-size: 11px;
text-decoration: none;
}

.div2 {
background-color: transparent;
border: 4px;
border-style: double;
border-color: transparent;
font-family: arial;
position: absolute;
top: 0%;
left: 50%;
margin-left: -373px;
top: 594px;
height: 162px;
width: 286px;
overflow-y: auto;
overflow-x: hidden;
z-index: 2;
color: ffffff;
font-weight: normal;
font-size: 11px;
text-decoration: none;
}

.div3 {
background-color: transparent;
border: 4px;
border-style: double;
border-color: transparent;
font-family: arial;
position: absolute;
top: 0%;
left: 50%;
margin-left: 115px;
top: 203px;
height: 199px;
width: 250px;
overflow-y: auto;
overflow-x: hidden;
z-index: 2;
color: ffffff;
font-weight: normal;
font-size: 11px;
text-decoration: none;
}

.div4 {
background-color: transparent;
border: 4px;
border-style: double;
border-color: transparent;
font-family: arial;
position: absolute;
top: 0%;
left: 50%;
margin-left: 115px;
top: 548px;
height: 204px;
width: 250px;
overflow-y: auto;
overflow-x: hidden;
z-index: 2;
color: ffffff;
font-weight: normal;
font-size: 11px;
text-decoration: none;
}





a.lalalalink:link, a.lalalalink:active, a.lalalalink:visited {
font-family: arial;
font-weight: bold;
font-size: 10px;
color: 7E0808;
width: 260px;
line-height: 18px;
background-color: 969789;
margin: 0 0 3px 0;
padding: 0 4px 0 0;
display: block;
text-align: center;
text-decoration: none;
letter-spacing: 2pt;
}
a.lalalalink:hover {
color: 999589;
font-weight: bold;
font-family: arial;
font-size: 10px;
letter-spacing: 2pt;
width: 260px;
line-height: 18x;
background-color: 000000;
padding: 0 0 0 4px;
display: block;
text-align: center;
}



.blacktext10 {
width: 500px;
margin: 0 0 -20px 0;
font-family: arial;
font-weight: normal;
font-size: 12px;
letter-spacing: 2pt;
color: 7E0808;
border-top-width: 0px;
border-bottom-width: 1px;
border-left-width: 0px;
border-right-width: 0px;
border-color: transparent;
border-style: solid;
display: block;
text-align: right;
}

.comt {
font-family: arial;
font-size: 10px;
color: ffffff;
width:650px;
height:700px;
overflow-y: auto;
overflow-x: hidden;
background-color:transparent;
border: 0px;
border-style: inset;
border-color: ;
position:absolute;
top:787px;
left:75%;
margin-left:-600px;
}

.blacktext10 {
width: 500px;
margin: 0 0 -20px 0;
font-family: arial;
font-weight: normal;
font-size: 12px;
letter-spacing: 2pt;
color: ffffff;
border-top-width: 0px;
border-bottom-width: 1px;
border-left-width: 0px;
border-right-width: 0px;
border-color: 4c4c4c;
border-style: solid;
display: block;
text-align: right;
}
.comt td b{
width: 635px;
font-family: arial;
font-weight: bold;
font-size: 10px;
display: block;
text-align: center;
}

.comt td a{visibility:auto;}

.bbzherp {style of: comment text;}
.comt td td td, .comt td td td b {
font-size:11px !important;
font-family:arial !important;
color:7E0808 !important;
}
.comt a {
font-weight: bold;
font-family: arial;
color: 7E0808;
font-size: 10px;
text-decoration: none;
}
.comt a:hover {
font-family: arial;
color: 999589;
font-weight: normal;
font-size: 11px;
text-decoration: none;
}
.redtext, .redbtext {
font-family: arial;
font-size: 16px;
font-weight: normal;
font-color: ffffff;
}

.comt td, .comt table{width:0px!important; height:0px!important; background-color:transparent!important; border:0px!important; _padding:9px!important;} .comt, .comt td, .comt table, .comt td a img, .comt td td td a, .comt td b a, .comt td .redlink{visibility:visible;} .comt td td td b{top:0px; display:;} .comt td td td table, .comt .orangetext15, .redlink, .comt .btext, .rid, .frnd{display:none;} .comt td b, .blacktext10 {display:block;} .comt {z-index:7;}
.comt table, .comt b {position:relative; top:-29px; _top:-29px;}



</style>



and here's my id like to meet section

CODE
<div class="div1">Put whatever you want here pics, vids, words..whatever, this box with scroll...Blah, blah blah blah blah blah blah...Put whatever you want here pics, vids, words..whatever, this box with scroll...Blah, blah blah blah blah blah blah...Put whatever you want here pics, vids, words..whatever, this box with scroll...Blah, blah blah blah blah blah blah...Put whatever you want here pics, vids, words..whatever, this box with scroll...Blah, blah blah blah blah blah blah...Put whatever you want here pics, vids, words..whatever, this box with scroll...Blah, blah blah blah blah blah blah...Put whatever you want here pics, vids, words..whatever, this box with scroll...Blah, blah blah blah blah blah blah...Put whatever you want here pics, vids, words..whatever, this box with scroll...Blah, blah blah blah blah blah blah...Put whatever you want here pics, vids, words..whatever, this box with scroll...Blah, blah blah blah blah blah blah...Put whatever you want here pics, vids, words..whatever, this box with scroll...Blah, blah blah blah blah blah blah...Put whatever you want here pics, vids, words..whatever, this box with scroll...Blah, blah blah blah blah blah blah...Put whatever you want here pics, vids, words..whatever, this box with scroll...Blah, blah blah blah blah blah blah...Put whatever you want here pics, vids, words..whatever, this box with scroll...Blah, blah blah blah blah blah blah...Put whatever you want here pics, vids, words..whatever, this box with scroll...Blah, blah blah blah blah blah blah...Put whatever you want here pics, vids, words..whatever, this box with scroll...Blah, blah blah blah blah blah blah...Put whatever you want here pics, vids, words..whatever, this box with scroll...Blah, blah blah blah blah blah blah...Put whatever you want here pics, vids, words..whatever, this box with scroll...Blah, blah blah blah blah blah blah...Put whatever you want here pics, vids, words..whatever, this box with scroll...Blah, blah blah blah blah blah blah...Put whatever you want here pics, vids, words..whatever, this box with scroll...Blah, blah blah blah blah blah blah...Put whatever you want here pics, vids, words..whatever, this box with scroll...Blah, blah blah blah blah blah blah...Put whatever you want here pics, vids, words..whatever, this box with scroll...Blah, blah blah blah blah blah blah...Put whatever you want here pics, vids, words..whatever, this box with scroll...Blah, blah blah blah blah blah blah...Put whatever you want here pics, vids, words..whatever, this box with scroll...Blah, blah blah blah blah blah blah...Put whatever you want here pics, vids, words..whatever, this box with scroll...Blah, blah blah blah blah blah blah...Put whatever you want here pics, vids, words..whatever, this box with scroll...Blah, blah blah blah blah blah blah...Put whatever you want here pics, vids, words..whatever, this box with scroll...Blah, blah blah blah blah blah blah...</div>
<div class="div2">NAME: Name Here<br>
AGE: Age Here<br>
HEIGHT: Height Here<br>
WEIGHT: Weight Here<br>
HAIR: Hair Color Here<br>
EYES: Eye Color Here<br>
ETHNICITY: Ethnicity Here<br>
LOCATION: Location Here<br>
RELIGION: Religion Here<br>
FAVORITE FOOD: Favorite food<br>
FAVORITE DRINK: Favorite Drink<br>
FAVORITE STORE: Favorite Store<br>
FAVORITE SPORT: Favorite Sport</div>


<div class="div3"><marquee direction=left>
<img src="http://i73.photobucket.com/albums/i210/rachaell_d/samplepic1.jpg"><img src="http://i73.photobucket.com/albums/i210/rachaell_d/samplepic1.jpg"><img src="http://i73.photobucket.com/albums/i210/rachaell_d/samplepic1.jpg"><img src="http://i73.photobucket.com/albums/i210/rachaell_d/samplepic1.jpg"><img src="http://i73.photobucket.com/albums/i210/rachaell_d/samplepic1.jpg"><img src="http://i73.photobucket.com/albums/i210/rachaell_d/samplepic1.jpg"><img src="http://i73.photobucket.com/albums/i210/rachaell_d/samplepic1.jpg"><img src="http://i73.photobucket.com/albums/i210/rachaell_d/samplepic1.jpg">
</marquee></div>

<div class="div4">s, vids, words..whatever, this box with scroll...Blah, blah blah blah blah blah blah...Put whatever you want here pics, vids, words..whatever, this box with scroll...Blah, blah blah blah blah blah blah..s, vids, words..whatever, this box with scroll...Blah, blah blah blah blah blah blah...Put whatever you want here pics, vids, words..whatever, this box with scroll...Blah, blah blah blah blah blah blah..s, vids, words..whatever, this box with scroll...Blah, blah blah blah blah blah blah...Put whatever you want here pics, vids, words..whatever, this box with scroll...Blah, blah blah blah blah blah blah..s, vids, words..whatever, this box with scroll...Blah, blah blah blah blah blah blah...Put whatever you want here pics, vids, words..whatever, this box with scroll...Blah, blah blah blah blah blah blah..s, vids, words..whatever, this box with scroll...Blah, blah blah blah blah blah blah...Put whatever you want here pics, vids, words..whatever, this box with scroll...Blah, blah blah blah blah blah blah..s, vids, words..whatever, this box with scroll...Blah, blah blah blah blah blah blah...Put whatever you want here pics, vids, words..whatever, this box with scroll...Blah, blah blah blah blah blah blah..s, vids, words..whatever, this box with scroll...Blah, blah blah blah blah blah blah...Put whatever you want here pics, vids, words..whatever, this box with scroll...Blah, blah blah blah blah blah blah..</div>



<div class="links">
<center>
<a class="lalalalink"href="http://mail.myspace.com/index.cfm?fuseaction=mail.message&friendID=YOURFRIENDID
">Message</a>

<a class="lalalalink" href=" http://collect.myspace.com/index.cfm?fusea...ID=YOURFRIENDID
">Add</a>

<a class="lalalalink" href=" http://collect.myspace.com/index.cfm?fusea...ID=YOURFRIENDID
">Block</a>

<a class="lalalalink"href=" http://viewmorepics.myspace.com/index.cfm?...ID=YOURFRIENDID
">View Pics</a>

<a class="lalalalink"href=" http://home.myspace.com/index.cfm?fuseacti...ID=YOURFRIENDID
">View Friends</a>

<a class="lalalalink"href="http://www.skem9.com/~55453">Layout By...</a>
</div>



<div class="commentbox">
<center>

<form method="post" action="http://comments.myspace.com/index.cfm?fuseaction=user.ConfirmComment"><input name="friendID" value="YOURFRIENDID" type="hidden"> <textarea name="f_comments" class="Skem9box"></textarea><br /><input type="submit" value="Add Comment." class="Skem9sub"></form>
</center>
</div>
<div class="blog">
<img src="http://i6.photobucket.com/albums/y242/brooklyneast05/Myspace/Myspace_v2_by_wireless_studios.jpg" border="0"/></div>

<div class="bottom"></div>
<div class="comt"><table class="center"><tr><td><table>






it still shows up the same way, with the main overlay not visable
 
brooklyneast05
post May 26 2007, 04:50 PM
Post #12


I'm Jc
********

Group: Mentor
Posts: 13,619
Joined: Jul 2006
Member No: 437,556



well
the first time i forgot to add the code at the bottom of my code
but i went back and put it in
still no change though
 

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