How to repeat GIF on webpage?

  Newuser3443 12:43 26 Jul 2006


I have a small checker board gif which I want to repeat to create a checkered line 1/4 way across my webpage, but I'm not sure how to do this.

Can anyway offer assistance please?

Thanks in advance,


  harristweed 14:32 26 Jul 2006

use css to make the check area always 25% of the screen.

<style type="text/css" media="screen">
#check {
height: 42px;
width: 25%;
<div id="check"></div>

here's the result

click here

  Newuser3443 17:52 26 Jul 2006


Thanks for your help. Sorry, it's my fault for not making myself clear. I mean't a vertical column of checkers positioned approx. 1/4 way across the webpage but running all the way down it.


  ade.h 18:39 26 Jul 2006

How big do you intend your page to be?
Is it left aligned or in a table?

If it is in a table layout, you can use your chequer image as the background in one column. If you're using a fix layout or other form of layout, make gif comprising a white strip as wide or wider than any likely screen resolution and place the chequer in that strip. If you make it wide enough, it will be prevented from repeating horizontally and will only repeat vertically.

  ade.h 18:48 26 Jul 2006

Like this? click here

  Newuser3443 19:01 26 Jul 2006

Exactly like that ade. I was hoping not to have to use javascript though.

I had looked at using a table and applying the gif to one column but it seems to generate an awful lot of code just to so that. I was trying to find a more elegant solution.

Thanks, Rob

  ade.h 19:24 26 Jul 2006

No javascript involved. Check the page source and you'll see what I mean.

This thread is now locked and can not be replied to.

Elsewhere on IDG sites

Alienware 17 R4 2017 review

Illustrator Sylvain Tegroeg created thousands of intricate line drawings for the mobile game…

Best iPad buying guide 2017

Comment télécharger une application indisponible en France ?