Pomoc - Szukaj - Użytkownicy - Kalendarz
Pełna wersja: [HTML][CSS]Tekst mi się rozjeżdża, kodowanie na DIV'ach
Forum PHP.pl > Forum > Przedszkole
Adam-240
Witam, ponieważ od jakiegoś czasu interesuje się webmasteringiem dzisiaj zakodowałem stronę w xHTML'u i CSS na DIV;ach lecz mam taki problem ponieważ tekst mi wyjeżdża poza rozmiar paneli. Mam lewe menu i boczny panel z treścią, jak wstawię więcej tekstu to nie przechodzi do nowej linii tylko pisze się cały czas w linii i stroan się rozjeżdża, prosiłbym o pomoc bo nie moge błędu znaleźć.

Oto plik css:

Kod
body {
  background-color: #f7f7f7;
  color: #191919;
  font-size: 11px;
  font-family: Verdana;
  margin: 0 auto;
  }
  
  img {
  border: 0;
  }
  
  #belka {
  background-image: url('images/img_02.jpg');
  width: 100%;
  height: 18px;
  padding-top: 6px;
  text-align: center;
  }
  
  #site{
  width: 900px;
  margin: 0 auto;
  }
  
  #logo {
  background-image: url('images/img_05.jpg');
  width: 900px;
  height: 131px;
  }
  
  .istopka {
  color: #94c52e;
  }
  
  a {
  color: #6c1661;
  }
  
  a:hover {
  color: #9cc930;
  }
  
  #menu {
  }
      
      #menuc {
      background-image: url('images/bg_menu.jpg');
      width: 840px;
      height: 36px;
      padding-top: 6px;
      padding-left: 60px;
      }
      
          #menuc ul {
          margin: 0 auto;
          padding: 0;
          }
          
          #menuc ul li {
          display: inline;
          list-style-type: none;
          padding: 0px;
          }
          
          #menuc ul li a,
          #menu ul li a:hover {
          display: block;
          float: left;
          text-decoration: none;
          }
          
          #menuc ul li a {
          background-image: url('images/menu2.jpg');
          width: 130px;
          height: 24px;
          font-size: 14px;
          text-align: center;
          color: #ffffff;
          padding-top: 6px;
          }
          
          #menuc ul li a:hover {
          background-image: url('images/menu1.jpg');
          width: 130px;
          height: 25px;
          font-size: 14px;
          text-align: center;
          padding-top: 5px;
          color: #000000;
          }
          
  #linia {
  width: 100%;
  height: 5px;
  background-color: #f7f7f7;
  }
          
  #tresc {
  padding-left: 50px;
  }
  
  #nawigacja {
  width: 250px;
  float: left;
  }
  
      #naglowek1 {
      background-image: url('images/img_23.jpg');
      width: 240px;
      height: 25px;
      color: #000000;
      font-size: 12px;
      padding-top: 9px;
      padding-left: 10px;
      }
      
      #tresc1 {
      background-image: url('images/img_27.jpg');
      width: 240px;
      padding-left: 5px;
      padding-right: 5px;
      padding-top: 3px;
      }
      
          #tresc1 ul {
          margin: 0 auto;
          padding: 0;
          }
          
          #tresc1 ul li {
          list-style-type: none;
          padding: 0px;
          }
          
          #tresc1 ul li a,
          #tresc1 ul li a:hover {
          display: block;
          text-decoration: none;
          }
          
          #tresc1 ul li a {
          height: 15px;
          padding-left: 10px;
          color: #000000;
          }
          
          #tresc1 ul li a:hover {
          background-color: #ffffff;
          height: 15px;
          padding-left: 15px;
          color: #81b829;
          }
      
      #koniec1 {
      background-image: url('images/img_33.jpg');
      width: 250px;
      height: 11px;
      }
      
  #news {
  width: 550px;
  float: left;
  }
  
      #naglowek2 {
      background-image: url('images/img_24.jpg');
      width: 520px;
      height: 25px;
      color: #ffffff;
      font-size: 12px;
      padding-left: 30px;
      padding-top: 9px;
      }
      
      #tresc2 {
      width: 500px;
      padding-left: 25px;
      padding-right: 25px;
      }
      
      #koniec2 {
      background-image: url('images/img_31.jpg');
      width: 550px;
      height: 11px;
      }
      
  #stopka {
  background-image: url('images/img_35.jpg');
  width: 800px;
  color: #ffffff;
  height: 35px;
  clear: both;
  text-align: center;
  padding-top: 20px;
  margin: 0 auto;
  }


Z góry dzięki za pomoc.
hiszpanespaniol
podaj html jak możesz, będzie łatwiej znaleźć problem. Daj w nim tą treść tez, nóż widelec są to długie linki (jeden ogromnie długi wyraz)

jeżeli dopiero zaczynasz, to nie nabywaj złych nawyków: a:hover dziedziczy szerokość po a (usuń 130px); paddingi możesz pisać wszystkie razem, np padding: 5px 6px 4px 2px zamiast każdy w nowej linii.

Poza tym duży plus za śliczny css smile.gif
Adam-240
Ok dzięki za informacje, dopiero zaczynam z CSS i kodowaniem zgodnym ze standardami.

Jeżeli chodzi o tekst to już problem rozwiązałem bo wstawiłem go do notepada a nie wiem jakim cudem ale jak przeniosłem tekst do pajączka bo notepad nie obsługuje kodowania ISO to tekst się złączył w 1 całość a ja nawet tego nie zauważyłem.

A co do paddingu to jak wstawię tak:

padding: 5px 6px 4px 2px

to który odpowiada za górny, dolny, lewy i prawy ?
ayeo
Witam!

Popraw proszę tytuł na zgodny z zasadami dział Przedszkole.

Pozdrawiam!
To jest wersja lo-fi głównej zawartości. Aby zobaczyć pełną wersję z większą zawartością, obrazkami i formatowaniem proszę kliknij tutaj.
Invision Power Board © 2001-2025 Invision Power Services, Inc.