Problem z tłem na stronie html-css

Question

Witam 

Mam problem z moją stroną www. Chciał bym żeby tło było na całą stronę, a nie jak na zdjęciu: Jak mogę to naprawic?

Mój kod:

#container {
		float: left;
  width: 960px;
  padding: 10px;
	background-image: url(../images/bg.png);
} 

Pozdrawiam Igor

Answer 1

Jeśli obraz ma wymiary mniejsze niż rozmiary diva dla którego chcesz ustawić go jako tło, wtedy wypełnia diva powielając wielokrotnie ten sam obraz

dodaj:

background-repeat: no-repeat; /* by uniknąć powielania */
background-attachment: fixed; /* ta linia jest tu dla pewności aby obraz był zawsze rozciągnięty */ 
background-size: cover; /* to zapewni nam pokrycie całego diva tylko i wyłącznie jednym obrazem */

powinno wszystko śmigać

Comments

Niestety to nie pomoglo, mam caly czas powielajacy się obraz, ale teraz jest on rowniejszy 

#container {
  float: left;
  width: 960px;
  padding: 10 px;
  background-repeat: no-repeat;
  background-attachment: fixed; 
  background-size: cover;
  background: url(../images/bg.png);
}

 

---

A spróbuj w taki sposób:

  background: url() no-repeat center fixed; 
  background-size: cover;

 

---

Oo to działa, dziekuje bardzo :D

Answer 2

Wklej cały kod html i css  oraz daj  obraz który chcesz mieć jako tło  strony

Comments

Dobrze

body {
  font-family: Arial, Helvetica, sans-serif;
  font-size: 12px;
  color: #555;
  text-align: center;
  margin: 0;
  background: #000 url(../images/bg_body.png) repeat-x;
}

#wrapper {
  width: 960px;
  margin: 0 auto;
  text-align: left;
  background: url(../images/bg%20copy.png) no-repeat;
}

a {
  color: #9c944e;
  text-decoration: none;
}

p {
  color: #FFF;
}

a:hover {
  text-decoration: underline;
}

#header {
  width: 960px;
  height: 105px;
  float: left;
  background: url(../images/bg_top.jpg) repeat-x;
}

.logo {
  float: left;
  padding-top: 25px;
  padding-left: 30px;
}

.logo a, #logo img {
  text-decoration: none;
  border: 0px;
  text-align: center;
}

#menu {
  float: right;
  margin-top: 45px;
}

#menu ul {
  list-style: none;
  margin:0 auto!important;
  padding: 0px 0px 0px 0px;
  text-align: center;
  float: left;
  clear: left;

}

#menu li {
  display: block;
  color: #FFF;
  text-align: center;
  float: left;
}

#menu a {
  color: #ccc;
  font-size: 13px;
  display: block;
  padding: 10px 15px 10px 15px;
  text-decoration: none;
  text-transform: uppercase;
  font-family: Arial;
}

#menu a:hover {
  color: #fff;
}

.margin1 {
  margin-left: 15px;
}

.margin2 {
  margin-left: 7px;
}

.margin3 {
  margin-top: 10px;
}

#box_news {
  float: right;
  width: 550px;
  padding: 10px;
  background: url(../images/bg_trs.png);
  -webkit-border-radius: 5px;
    -khtml-border-radius: 5px; 
    -moz-border-radius: 5px; 
    border-radius: 5px;
}

#box_news h2, #box_fp h2 {
  font-size: 24px;
  text-transform: uppercase;
  color: #fff;
  font-weight: normal;
  background: url(../images/bullet.png) no-repeat left;
  padding-left: 40px;
}

#box_news p, #box_fp p {
  color: #ccc;
  line-height: 20px;
  text-align: justify;
  font-size: 13px;
  font-family: Arial;
}

#box_news img {
  border: 1px solid #ccc;
  padding: 5px;
  margin-right: 15px;
  -webkit-border-radius: 5px;
    -khtml-border-radius: 5px; 
    -moz-border-radius: 5px; 
    border-radius: 5px;

}

#box_fp {
  width: 300px;
  float: right;
  padding: 10px;
  margin-right: 20px;
  background: url(../images/bg_trs.png);
  -webkit-border-radius: 5px;
    -khtml-border-radius: 5px; 
    -moz-border-radius: 5px; 
    border-radius: 5px;
}

#box_fp a {
  padding-left: 20px;
  color: #999;
  background: url(../images/bullet2.gif) no-repeat left;
  margin-left: 10px;
  line-height: 26px;
}

#box_fp a:hover {
  margin-left: 15px;
  text-decoration: none;
  font-weight: bold;
}

#container {
  float: left;
  width: 960px;
  padding: 10 px;
  background: url(../images/bg.png) no-repeat 0cm -0,5cm;
}

h2 {
  font-size: 22px;
  font-weight:normal;
  color: #fff;
}

#footer {
  width: 960px;
  float: left;
  margin-left: 1px;
  background: url(../images/bg_content_bottom.png) no-repeat;
  padding-top: 5px;
}

#footer p {
  font-size: 12px;
  color: #666;
}

#footer a {
  color: #ccc;;
}

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Historia</title>
 <link rel="stylesheet" type="text/css" href="css/style.css" />
 <link rel="icon" href="images/symbol.png"> 
</head>

<body>
  <div id="wrapper">
  <div id="header">
  <img src="images/logo.png" class="logo" />
  <div id="menu">
        <ul>
        <li><a href="#"><a href="index.html"</a>Strona główna</a></li>
        <li><a href="#"><a href="historia"</a>Historia</a></li>
        <li><a href="#"><a href="robert.html"</a>Robert Maxon Historia</a></li>
        <li><a href="#"><a href="rangi.html"</a>Rangi odłamu Maxon'a</a></li>
        </ul>
    </div> 
  </div>
  <div id="container">
    <div id="box_news">
    <h2>Historia Bractwa Stali - Początki</h2>
    <img src="images/image.png" align="left" />
    <font color="silver"> <span style="font-size: small">
      <ul>
<li>2076, 3 stycznia - Wysłanie oddziału do West Tek. Wśród żołnierzy znajdował się kapitan Roger Maxson (dziadek Johna Maxsona, Wysokiego Starszego Bractwa Stali).</li></p>

<li>2077, październik - Roger Maxson odkrywa zbrodnie, jakich dopuścili się naukowcy w Bazie Wojskowej Mariposa. Jego ludzie powierzają mu rolę dowódcy.</li>

<li>2077, 27 października - Maxson i jego ludzie zapieczętowują bazę i wyruszają na Pustkowie zabierając ze sobą schematy broni oraz surowce. Generał prowadzi ich do bunkra w Lost Hills (część tych żołnierzy utworzy w przyszłości Bractwo). </li>

<li>2077, listopad - Maxson wraz z pozostałymi przybywa do Lost Hills. W trakcie podróży ginie jego żona, zostaje mu tylko syn. Powstaje Bractwo Stali. </li> 
      </ul>
      </font>
      </span>
    </div>
   <div id="container">
    <div id="box_news">
    <h2>Historia Bractwa Stali - Wczesne Lata</h2>
    <img src="images/image.png" align="left" />
    <font color="silver"> <span style="font-size: small">
      <ul>
<li>2097 - W bunkrze Lost Hills rodzi się John Maxson (wnuk Rogera Maxsona).</li>

<li>2134 - Grupa pod dowództwem sierżanta Dennisa Allena mimo sprzeciwu Starszych Bractwa wyrusza do Blasku w poszukiwaniu technologii, lecz wszyscy giną.</li>

<li>2135 - Roger Maxson umiera na raka i władzę w Bractwie przejmuje jego syn - Maxson II</li>

<li>2150 - Bractwo zyskuje pełną kontrolę na terenach dookoła Lost Hills. Gang Żmij tworzy bazę na południe od Lost Hills, zwiększa częstotliwość swoich ataków i powoli przyciąga uwagę Bractwa</li>

<li>2155 - Kilka oddziałów Bractwa zostaje wysłanych razem z Maxsonem aby zniszczyć Żmije. Maxson II umiera zraniony zatrutą strzałą. John Maxson obejmuje stanowisko Wysokiego Starszego w Bractwie Stali. Paladyni pod wodzą Rhombusa odnajdują żmije a następnie wybijają prawie wszystkie. Nieliczni ocalali uciekają na wschód.</li>
      </ul>
      </font>
      </span>
    </div>
   <div id="container">
    <div id="box_news">
    <h2>Historia Bractwa Stali - Zagrożenie ze strony supermutantów</h2>
    <img src="images/image.png" align="left" />
    <font color="silver"> <span style="font-size: small">
      <ul>
<li>2161, październik - Patrol Bractwa natrafia na zwłoki supermutanta. Zabierają je ze sobą a skryba Vree prowadzi nad nimi badania. Bractwo przygotowuje się do wojny z supermutantami.</li>

<li>2162 - Przybysz z Krypty spotyka się ze Starszym Maxsonem i z pomocą żołnierzy Bractwa niszczy bazę Mariposa likwidując przy tym prawie całkowicie zagrożenie jakim była armia supermutantów.</li>

<li>2162 - Rozpoczyna się walka Bractwa z niedobitkami armi Mistrza.</li>

<li>2196 - Rozłam w Bractwie - powstaje Środkowo-Zachodnie Bractwo Stali.</li>
      </ul>
      </font>
      </span>
    </div>
   <div id="container">
    <div id="box_news">
    <h2>Historia Bractwa Stali - Zagrożenie ze strony Enklawy</h2>
    <img src="images/image.png" align="left" />
    <font color="silver"> <span style="font-size: small">
      <ul>
<li>2242 - Bractwo wiedząc, że ich technologia nie może się równać technologii Enklawy, decyduje się tylko ją obserwować. Tworzy ono bunkry w rejonach aktywności Enklawy, a Dziecko Przeznaczenia przekazuje Mattowi w San Francisco plany latacza.</li>
      </ul>
      </font>
      </span>
    </div>
  <div id="container">
    <div id="box_news">
    <h2>Historia Bractwa Stali - Zagrożenie ze strony Enklawy</h2>
    <img src="images/image.png" align="left" />
    <font color="silver"> <span style="font-size: small">
      <ul>
Pomiędzy 2246 a 2251 - Rozpoczyna się wojna Bractwa z RNK.

<li>2254 - Bractwo Stali wysyła ekspedycję do Waszyngtonu pod dowództwem paladyna Lyonsa.</li>
        
<li>2275 - RNK po utworzeniu bazy w Camp McCarran zaczyna walkę z Bractwem na pustyni Mojave.</li>

<li>2276 - Bractwo Stali na Pustkowiach Mojave ponosi porażkę w HELIOSIE Jeden na rzecz RNK w wyniku Operacji: Sunburst.</li>

<li>2281 - Bractwo Stali na terenach Pustkowi Mojave, zawiera sojusz z RNK lub zostaje zniszczone.</li>
      </ul>
      </font>
      </span>
    </div>
   <div id="container">
    <div id="box_news">
    <h2>Historia Bractwa Stali - Bractwo na wschodzie</h2>
    <img src="images/image.png" align="left" />
    <font color="silver"> <span style="font-size: small">
      <ul>
<li>2255 - Przybycie ekspedycji Starszego Lyonsa na tereny Waszyngtonu. Operacja Bicz Boży.</li>
        
<li>2276 - Henry Casdin i niektórzy członkowie Bractwa Stali Ruin Solicy opuszczają Cytadelę i ogłaszają się Wygnańcami.</li>

<li>2277 - Bractwo Stali odbija oczyszczalnik w Pomniku Jeffersona z rąk Enklawy.</li>

<li>2278 - Bractwo z pomocą Samotnego Wędrowca niszczy Samobieżną Bazę Polową, oraz przejmuje olbrzymie ilości zaawansowanej technologii (w tym Latacze).</li>

<li>2278 - Śmierć Owyna oraz Sary Lyons.</li>

<li>2283 - Arthur Maxson staje się najmłodszym Starszym w historii. Doprowadza do pokoju między Bractwem Lyonsa oraz Wygnańcami oraz do powrotu tych drugich w struktury Zakonu. Reorganizuje upadające Bractwo Lyonsa i przekształca je we Wschodnie Bractwo Stali, będące odziałem Bractwa z Zachodu.</li>
      </ul>
      </font>
      </span>
    </div>
    <div id="footer">
        <p>&copy Wszelkie prawa zastrzeżone. <br /> Projekt: <a href="https://bractwostalipl.ct8.pl/">Bracto Stali Polska</a></p>
    </div>
    </div>
</body>
</html>

To są kody strony z historią, czy podawać kody innych stron?

Tło:

---

Masz za mały obrazek na tło  lepiej zrobić większy niż mniejszy ale z mniejszego też da  się zrobić ale to już jest kombinacja  podaje ci przykład przeanalizuj sobie to  poszukaj co dany element  za co odpowiada jest parę błędów w kodzie na razie nie będę pisał o tym  skup się  na  nauce podstawy 

https://jsfiddle.net/gt9qp0nz/1/

oraz zobacz na tej stronie tutaj

zamiast

background-size:100% 100%;

 daj 

background-size:cover;

 zobaczysz różnicę