Nachdem du dir ein Stueckchen deines Hintergrundes in der y-Achse ausgeschnitten hast:
Html:
#conteinerX {
   background: #ffd700 url('my_background.gif') repeat-x;
}

Wenn es schon daran scheitern sollte, dass du nicht weiter weisst, was obige Anweisungen bewirken, dann vergiss es bitte gleich und setzt dich erstmal an die elementaren Grundlagen der Gestaltung.

Zu deiner Bildergeschichte.
Es gibt, obwohl ich zugeben muss, dass es noch relativ tricky ist, die Moeglichkeit von mehreren Hintergruenden.
Man kann, via radialen Verlaeufen und color-stop genau das hinbekommen, was du hier moechtest.
Warum es allerdings sehr schwer ist, fuer jemanden der ungeuebt ist: Die Browser unterstuetzen nicht alle einheitliche Schreib -bzw. Darstellungsweisen. Wenn man aber ein Fallback setzt, spricht eigentlich nichts gegen das Experimentieren.

Zum Problem mit dem Auslaufenden Text.
Angenommen du hast folgendes Szenario:
Html:
<!doctype html>
<html lang="de">
   <head>
      <meta charset="utf-8">
      <title>MySite</title>
   
   <body>
      <div id="container">
         <header>
            <hgroup>
               <h1>my title</h1>
               <h2>description title</h2>

            </hgroup><!-- endHGrouping -->
           
         </header><!-- endHeader -->

         <div id="main">
            <section id="content">
               <article>
                  <p>
                     Lorem ipsum dolor sit amet, consetetur sadipscing elitr,
                     sed diam nonumy eirmod tempor invidunt ut labore et dolore 
                     magna aliquyam erat, sed diam voluptua. At vero eos et 
                     accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, 
                     no sea takimata sanctus est Lorem ipsum dolor sit amet. 
                     Lorem ipsum dolor sit amet, consetetur sadipscing elitr, 
                     sed diam nonumy eirmod tempor invidunt ut labore et dolore 
                     magna aliquyam erat, sed diam voluptua. At vero eos et accusam 
                     et justo duo dolores et ea rebum. Stet clita kasd gubergren, 
                     no sea takimata sanctus est Lorem ipsum dolor sit amet.

               </article><!-- endArticle -->

            </section><!-- endContentSection -->

         </div><!-- endMain -->

     </div><!-- endConteiner -->

Du hast jetzt hier min. zwei Elemente, denen du eine Darstellungsbreite verpassen kannst, sodass dein Text nicht auslaeuft und sich immer in einem »Rahmen« bewegt. Hier waeren es jetzt das Article- oder Absatzelement p. Wobei es am besten waere dem Article eine gewisse Breite zu geben und dem p-Element einen Innenabstand.

Solltest du jetzt nur Bahnhof verstanden haben, dann such im Internet nach den Grundlagen oder lauf in die naechste Buchhandlung.