Help with getting an image to tile down the left hand side

Discussion in 'HTML & Website Design' started by Da_moma, Feb 2, 2008.

  1. #1
    With this code,

    I have a friend who is doing this web page for a class and they have to code the background image to run the left side of the page.

    Here is her code:

    
    <html>
    <head>
    <!-- 
       New Perspectives on HTML and XHTML
       Tutorial 3
       Case Problem 3
    
       ICI Home Page
       Author: Anita XXXXXX	
       Date: 2/1/2008  
    
       Filename:         crypt.htm
       Supporting files: back1.gif, back2.gif, locks.jpg, logo.gif, scytale.gif
    -->
    
    <title>International Cryptographic Institute</title>
    </head>
    
    <body style="color: white; 
    background: black; 
    background-image: url(back1.gif); 
    background-image: repeat-y; 
    float: margin-top -20" >
    
    <p>
    <img src="logo.gif" alt="ICI" style="float: left" width="95" height="75"/>
    </p>
    
    <h1 style="text-align: center; font-family: Courier New; font-size: 1.8em; letter-spacing: 0.3em; line-height: 0.7em; color: yellow;
    background-image: url(back2.gif)">
    THE&nbsp;<br />
    SCIENCE<br />
    &nbsp;&nbsp;OF<br />
    CRYPTOGRAPHY
    </h1>
    
    <h2 style="font-family: Arial, Helvetica, or sans-serif">What is Cryptography?</h2>
    
    <p><b>Cryptography</b> is the science of secure communications, 
    formed from the Greek words <i>kryptós</i> meaning "hidden" and <i>lógos</i>, meaning 
    "word". The first recorded use of cryptography was by the Spartans who (as early as 400 BC) 
    employed a cipher device called a "scytale" to send secret communications between military 
    commanders. The scytale consisted of a tapered baton around which was wrapped a piece of parchment 
    inscribed with the message. Once unwrapped the parchment appeared to contain an incomprehensible 
    set of letters, however when wrapped around another baton of identical size the original text 
    appears.
    <img src="scytale.gif" alt="" style="float: right; margin 0 0 10 100"/>
    </p>
    
    <p>Cryptographers developed more and more ingenious systems, 
    but it was in the 20<sup>th</sup>century, that the science of cryptography took off. 
    The first major achievement was the the development of rotor cipher machines. An American, 
    Edward Hebern recognised that by hardwiring alphabetic substitution in the connections from 
    one side of an electrical rotor to those on the other side and cascading a collection of such 
    rotors, alphabetic substitutions of almost any complexity could be produced. Germany engineers 
    independently discovered the rotor concept and designed the precursors to the most famous 
    cipher machine in history - the German Enigma machine which was used during World War 2. The 
    cracking of the Enigma ciphers byBritish and Polish cryptanalysts during the Second World War 
    is one of the greatest triumphs inthe history of cryptography and played an important role in 
    the Allie victory.</p>
    
    <hr />
    
    <p style="text-align: center">To learn more cryptography, please tour the site. <br />
       <img src="locks.jpg" alt="" />
    </p>
    
    </body>
    </html>
    Code (markup):
    The image back1.gif is the one they want to run on the left hand of the page.
    Any help would be greatly appreciated.

    Thank You
    Da_moma
     
    Da_moma, Feb 2, 2008 IP
  2. HDaddy

    HDaddy Active Member

    Messages:
    287
    Likes Received:
    6
    Best Answers:
    0
    Trophy Points:
    60
    #2
    i´m not sure i understand what you mean, but try this:

    <body style="color: white;
    background: black;
    background-image: url(yourimagefolder/back1.gif) top left repeat-y;
    >
     
    HDaddy, Feb 2, 2008 IP