Cancel

Trouble with Css codes

I'm sorry to bother you but I can figure this one out by myself.
I know the css codes are made for groups but I really like playing with them so I used them for my skin.
I think everything works quite fine except two things.
The first screen shot was made by my friend the second one is mine.

-The most noticeable difference on them is that on mine the bg of the box isn't partly transparent but she can see the transparency.
-The second problem are the missing slices 6 and 7 (I think it's those two)
I think I might done something wrong with the css codes but I cant figure it out.

Can someone help me?
I would really appreciate it.

My Friends Screen shot

My Screenshots


This are the codes I used for the slices:

Spoiler:

#topLeft {
background: url(http://i9.photobucket.com/albums/a71/podganca01/bg01.jpg) no-repeat
bottom right; /*slice1*/
}
#top {
background: url(http://i9.photobucket.com/albums/a71/podganca01/bg03.jpg) repeat-x
bottom left;
}/*slice3*/
#topCenter {
background: url(http://i9.photobucket.com/albums/a71/podganca01/bg02.jpg) no-repeat
bottom left;
}/*slice2*/
}
#main {
background-image: url(http://i9.photobucket.com/albums/a71/podganca01/bg07.jpg);
}/*slice7*/
#leftMenu {
background: url(http://i9.photobucket.com/albums/a71/podganca01/bg04.jpg) no-repeat top
right;
}/*slice4*/
#rightMenu {
background: url(http://i9.photobucket.com/albums/a71/podganca01/bg06.jpg) repeat-x top;
}/*slice6*/
#content {
background: url(http://i9.photobucket.com/albums/a71/podganca01/bg05.jpg) no-repeat top
left;
}/*slice5*/

norine07

norine07

사랑해? 복라요...

Cancel

well actually i think the codes are fine, many groups have that problem, so not to worry, just check through your codes~ ^-^ and no the pics are not missing its just like that~

and for the transparent i think futher down there is a code something like this:

div.inner {
background-color: #efbe8f !important;
border: 1px dashed #FFB2B5;
margin: 1px !important;
filter:alpha(opacity=80) !important;
-moz-opacity:0.80 !important;
opacity: 0.80 !important;
}

if you dun want it to be transparent, than take out this part~ ^-^
hope that helped~ ^-^

Signature Image

MapleRose

Moderator

MapleRose

Archangel no Kanchou

Cancel

For slice 6, since you've got a horizontal cut instead of a vertical one, you have to use repeat-y instead of repeat-x (or you can use repeat-x and change the image to a vertical bar, or use slice 7 instead).

As for the transparency thing, what browsers are you and your friend using? I think that Firefox works with the transparency CSS, but IE doesn't (which is really annoying).

merged: 06-21-2007 ~ 11:10pm
yup, I just viewed your page in both Firefox and IE, and I saw what your friend saw in Firefox, and what you saw in IE.

(btw nice userpage :) )

merged: 06-21-2007 ~ 11:50pm
okay I think the gaps is from IE's way of rendering pages. I figured out that the bottom horizontal gap is because your slice 4 isn't long enough. Firefox uses whatever colour is underneath (ie your background colour) to fill the gap when it sees the missing part in the box, but IE just sticks in the default MT skin for that box underneath, which is why there's a black gap there. What you can do is take your background colour, and stick it after the slice 4 code like this:

background: url(http://i9.photobucket.com/albums/a71/podganca01/bg04.jpg) no-repeat top
right #Hex code;
}/*slice4*/

where the "#Hex code" is your background colour.

I'm not sure what to do about the gap on the right though, still trying to figure that out myself ^^; Perhaps you can use the Skinbuilder to put in the background images, then use CSS for the colours and everything else :)

Signature Image
EGAO! Distant Destiny!:.:devART:.:C&C:.:P-o-R:.:Vectory:.:DSC:.:Simple-ism

Cancel

Thank you both very very very much for all your time and help :D


Norine07:
So that's why I saw similar gaps a while ago when I was checking out some groups.
That makes me a bit more relaxed.

MaplaRose:
I opened my page in Firefox too and saw the difference.
Thank you, that explains a lot :)
(Oh, and thank you for the lovely comment on my up)
I put the hex code where you told me to and in IE the horizontal gap is gone but in Firefox it's still there.
The repeat-y won work either on Firefox
Should I make the slice a bit longer then?

I thought to partly use the skin builder wouldn’t work.
But I'll do that now. :D

And what about if I do a skin for a Group and the same thing happens. As I heard groups don't have skin builders.

MapleRose

Moderator

MapleRose

Archangel no Kanchou

Cancel

aha, I've figured out how to get rid of the black thing on the right side (I think so anyway):

Find where it says

html, body {
background-color: WHATEVER COLOR;/*COLOR OF THE WHOLE BODY*/}

and change it to

html, body {
background: WHATEVER COLOR;/*COLOR OF THE WHOLE BODY*/}

ie, take out the "-color" after "background". It works because if you just use background-color, your CSS is only over-riding the colour of the default bg, not the pattern (which is what that black box thing is).

Hope that helps for future reference (for groups and stuff) ^__^

Signature Image
EGAO! Distant Destiny!:.:devART:.:C&C:.:P-o-R:.:Vectory:.:DSC:.:Simple-ism

Cancel

Thank you very much for all your help :D
I really appreciate it!

page 1 of 1 6 total items

Back to Userpage Customization | Active Threads | Forum Index

Only members can post replies, please register.