Stack Overflow
Stack Overflow

Questions tagged [background-repeat]

A CSS Property that defines whether or not background property of an element should "tile" to fill the entire element if the background is smaller than the element. This can be broken up into background-repeat-x for horizontal repeating and background-repeat-y for vertical repeating. The background repeat properly is typically used with an image for the background property.

71 questions
2
votes
2 answers

Should I use JPG or PNG for a tile-able background (background-repeat)?

I read a couple of questions on the topic and the general feedback I see is that JPGs are for photos and PNGs are for everything else: PNG should be used when: You need transparency (either 1-bit or alpha transparency) Lossless compression will…
Hristo
  • 45,559
  • 65
  • 163
  • 230
1
vote
5 answers

How can I make image in text box with no-repeat

I am applying an image to a text box as follows This is giving the following result I tried it applying no-repeat…
Developer
  • 8,390
  • 41
  • 129
  • 238
1
vote
1 answer

How to using CSS for "Left Slanted Stripe" on Background repeat-x setting for both ends

I am trying to making Left Slanted Stripe with CSS. I don't know how to make both ends not to show clearly like below image that I attached. ideas for Left Slanted Stripe Can I repeat as Counting Numbers of Image with CSS? Can I get some…
arborsday
  • 11
  • 2
1
vote
1 answer

Can multiple background images alternate when repeated?

I am trying to alternately tile multiple backgrounds images using CSS. Here is the essence of what I am trying, with two small square images X and O: background-image: url(images/X.png), url(images/O.png); background-repeat: repeat-x,…
Nathan Ryan
  • 12,893
  • 4
  • 26
  • 37
1
vote
1 answer

CSS background-repeat with multiple images

How can I use background-repeat with multiple images? The primary background image is static and only sits at the top of the unscrolled page. Once the user starts to scroll down on longer pages, there is a secondary background image than blends in…
Atomiklan
  • 5,164
  • 11
  • 40
  • 62
1
vote
1 answer

CSS Fail - background-position, background-repeat, background-size, background-attachment

When I put the following into a div in the main body, this WORKS:
1
vote
1 answer

Repeat Pattern to 100% of the viewport

in CSS i made that code: body { background-color:#f3f3f3; max-width:1920px; min-width:1024px; margin:0 auto; but to seperate the header from the content i would like to have a "bar" between them. so i made: #zig…
Marcel Schulz
  • 35
  • 5
1
vote
2 answers

background-size with background repeat counts with noticeable deviation

I've created square image and used it as repeated background-image for div. https://jsfiddle.net/cethbqog/2/ I applied it with: background-size: 5% auto; And I supposed that will be 20 cells in a row but it didn't happen. Can anyone help me with…
Andrey Tsarenko
  • 31
  • 3
1
vote
3 answers

CSS multiple Background Images both repeat-x

I try to get multiple background images in one div at the moment. Both must repeat-x. The first image should start at the top-left point up to 50% of the div. The second should start at the middle to the right end of the div. I tried the…
flightsearch
  • 79
  • 2
  • 10
1
vote
1 answer

x-repeating background images not fully expanding

I've spent hours now trying different things to figure out how to get 2 background images in css to expand the full width of the page. The site is here: http://res-intel.com I know that having a width defined in #main won't let it expand. However I…
user3750274
  • 11
  • 1
1
vote
0 answers

Not working background-repeat for mobile/tablet screen

I have a background pattern which I want to be repeated both vertically and horizontally. I use background-repeat:repeat; for body and it works fine, but when I resize the page (using Viewport Resizer) to a mobile/tablet screen a part of the…
dirigibleplum
  • 137
  • 2
  • 2
  • 12
1
vote
1 answer

Background-repeat bluring the color of picture?

I am currently trying to design some Call-to-action buttons, and I have made a dynamic width button, which is built by a left and right container and then a middle container holding all the text. The picture in the middle is a 50 px and…
denlau
  • 916
  • 2
  • 9
  • 21
1
vote
1 answer

SVG background repeat in IE

I've got a repeating stripe pattern which I've made as an SVG. I've then optimised it and exported it as a Data URI and applied as a repeating background in CSS. Works nicely in FireFox & Chrome and also have control over background-size which…
ETabrizi
  • 19
  • 1
1
vote
3 answers

CSS: 'Background-size' and 'background-repeat: repeat' stretch issue

I'm sure this is correct behavior for the implementation I have, but I'm wondering if theres an easy way to do what I want to accomplish. I have a background image that is a 3px x 3px pattern. I want this pattern to repeat-x the full width (100%) of…
bbedward
  • 6,368
  • 7
  • 36
  • 59
1
vote
0 answers

Chrome background size not being respected in repeat

I have a 25px by 25px gif, and repeating both xy in a 500x500. I overlay some images on top of it at exactly 25px. This works fine in Firefox, but Chrome seems to shrink the background gif xy by 1 pixel every 4 images! So, my overlays don't line…
dako
  • 41
  • 5
1
2
3 4 5