PDA

View Full Version : Css background repeat x



Alidad
01-06-2008, 05:36 AM
hi, There is something is not clear myself how i can write code in css.

I have first yellow background image with nice big font forground on the top of background image, the background wide size is 600 px, so now I want to put same yellow background images next to the first yellow background image with out and text font and repeat-x. that way show one wide 100% yellow image background.

I'm trying to figuer out how to write that code to use repeat-x for the second one next to the first background image.

.background {
background-image: url(../images/CSSYellowBackground.png);
background-repeat: repeat-x;

}
.image-background-text{
background-image: url(../images/INTheNameOFUSA.png);
background-repeat: no-repeat;
}

please help thanks.

alidad

boogyman
01-07-2008, 03:08 PM
I have first yellow background image with nice big font forground on the top of background image, the background wide size is 600 px, so now I want to put same yellow background images next to the first yellow background image with out and text font and repeat-x. that way show one wide 100% yellow image background

your explanation is difficult to understand. to me it reads you want to put two background images on the same element, which isnt possible. however in the code that you posted it appears you have two different classes.


I'm trying to figuer out how to write that code to use repeat-x for the second one next to the first background image.
background images are applied to the element that the are assigned to, if you want to have two background images next to each other, make your two elements side by side.




.background {
background-image: url(../images/CSSYellowBackground.png);
background-repeat: repeat-x;

}
.image-background-text{
background-image: url(../images/INTheNameOFUSA.png);
background-repeat: no-repeat;
}

png file types are generally large and very hi-res files. When used on a class like you are using these two, it is telling me that you are using this element multiple times, and thus alot of bandwidth. jpg and gif formats are much preferred for web images, especially a background-image.

also when you are posting code could you please use
tags. they are formatted differently and its generally easier to read by those that try to help out here.