CSS 4 MP

Jan 20, '08 3:15 PM
by *2diva for everyone

How do I make my Guestbook background transparent? also How do I change the color of the guestbook background without it affecting my contact headshots? How do you add a animated background to your Guestbook?

reply share

9 Comments

alogena wrote on Jan 20

as first note the code for the reply box affect the guestbook too

http://grouped.multiply.com/reviews/item/20

if u want a code affecting only the guestbook and not the reply boxes in all the site then as quick reply u have to use

the same code of the reply box but in every block u have to add

div#home_guestbook

at the head of any name ,

well I mean
this could be the base code for a transparent guestbook

div#home_guestbook .replybox {
background-color: transparent;
background-image: none;
border-width: 1px;
border-style: none;
border-color: #aaaaaa;
color: #aaaaaa;
}
div#home_guestbook .replyboxread {
background-color: transparent;
background-image: none;
border-width: 1px;
border-style: none;
border-color: #aaaaaa;
color: #aaaaaa;
}
div#home_guestbook .quotet {
background-color: transparent;
background-image: none;
border-width: 1px;
border-style: none;
border-color: #aaaaaa;
color: #aaaaaa;
}

form this code one just change
background-color: transparent;
to
background-color: #fffff;
or some other color u want there

change
background-image: none;
to
background-image: url(image_URL);

where image_URL is the background image u want there

change
border-width: 1px;
border-style: none;
border-color: #aaaaaa;

to
border-width: 1px;
border-style: solid;
border-color: #aaaaaa;

to have a 1pixel width border with #aaaaaa color

alogena wrote on Jan 20, edited on Jan 20

for the box where to write the messages the code only for the guestbook is

div#home_guestbook .replybox textarea {
-moz-border-radius-bottomleft:5px;
-moz-border-radius-bottomright:5px;
-moz-border-radius-topleft:5px;
-moz-border-radius-topright:5px;
background:transparent none repeat scroll 0%;
border:1px solid #CCCCCC;
}

change
border:1px solid #CCCCCC;
to
border:1px none #CCCCCC;
to remove the border

alogena wrote on Jan 20

AFAIK this code do not affect any headshot

for the animated background just use an animated gif image for the background ,,
upload in some place the images
(I suggest u do not use external service
rather use a dedicated photo album in ur site posted privatye only for u
the images will load more quickly that any external servic as photobucket etcv .)

place the URL where is
image_URL in the code above