Witaj Gościu! ( Zaloguj | Rejestruj )

Forum PHP.pl

 
Reply to this topicStart new topic
> [css] wszystko w jednej kupie
skali
post 13.02.2008, 17:11:07
Post #1





Grupa: Zarejestrowani
Postów: 70
Pomógł: 3
Dołączył: 21.08.2006
Skąd: Zheshuv

Ostrzeżenie: (0%)
-----


witam. mam problem taki ze dodajac doctype dolna czesc przechodzi tam gdzie gorna.

http://images27.fotosik.pl/157/feff863648302587med.jpg

dlaczego cos takiego sie dzieje? dziekuje z gory za pomoc
Go to the top of the page
+Quote Post
punkomuzykant
post 14.02.2008, 11:35:19
Post #2





Grupa: Zarejestrowani
Postów: 147
Pomógł: 3
Dołączył: 28.12.2007
Skąd: toronto

Ostrzeżenie: (0%)
-----


na 100% coś zepsułeś smile.gif samo się nie stało, zresztą poka kod
Go to the top of the page
+Quote Post
skali
post 14.02.2008, 13:31:14
Post #3





Grupa: Zarejestrowani
Postów: 70
Pomógł: 3
Dołączył: 21.08.2006
Skąd: Zheshuv

Ostrzeżenie: (0%)
-----


bez doctype klik
z doctype klik
Go to the top of the page
+Quote Post
Jarod
post 14.02.2008, 13:57:52
Post #4





Grupa: Zarejestrowani
Postów: 1 190
Pomógł: 27
Dołączył: 23.04.2005

Ostrzeżenie: (0%)
-----


Masz błąd w kodzie. Bez doctype przeglądarki lubią się dziwnie zachowywać. Szczególnie IE.


--------------------
”Godzina nauki w życiu nowoczesnego apostoła jest godziną modlitwy.”
(św. Josemaría Escrivá, Droga, 335)
Go to the top of the page
+Quote Post
skali
post 14.02.2008, 14:51:59
Post #5





Grupa: Zarejestrowani
Postów: 70
Pomógł: 3
Dołączył: 21.08.2006
Skąd: Zheshuv

Ostrzeżenie: (0%)
-----


Cytat(Jarod @ 14.02.2008, 13:57:52 ) *
Masz błąd w kodzie.


co to ma znaczyc? pokaz mi palcem gdzie, bo ja nie mam pomyslu gdzie szukac...

Ten post edytował skali 14.02.2008, 14:53:53
Go to the top of the page
+Quote Post
Jarod
post 14.02.2008, 16:01:42
Post #6





Grupa: Zarejestrowani
Postów: 1 190
Pomógł: 27
Dołączył: 23.04.2005

Ostrzeżenie: (0%)
-----


Cytat(skali @ 14.02.2008, 14:51:59 ) *
co to ma znaczyc? pokaz mi palcem gdzie, bo ja nie mam pomyslu gdzie szukac...



  1. #srodeklewadol {
  2. background-color: #111111;
  3. width: 470px;
  4. height: 80px;
  5. border: #777777 3px solid;
  6. padding: 7px 12px 7px 12px;
  7. clear: both;
  8. }

I już jest ok.


--------------------
”Godzina nauki w życiu nowoczesnego apostoła jest godziną modlitwy.”
(św. Josemaría Escrivá, Droga, 335)
Go to the top of the page
+Quote Post
skali
post 14.02.2008, 17:01:25
Post #7





Grupa: Zarejestrowani
Postów: 70
Pomógł: 3
Dołączył: 21.08.2006
Skąd: Zheshuv

Ostrzeżenie: (0%)
-----


dziala super ale mam nastepny problem. a mianowicie sztywna dlugosc div'a. jak zrobic zeby ustawic np 400px ale jak bedzie wiecej teksty to zeby nie nachodzilo na div'a znajdujacego sie nizej tylko ten dolny sie posunal troche nizej. odrazu mowie ze min-height ani 100% nie dziala
Go to the top of the page
+Quote Post
Jarod
post 14.02.2008, 17:14:16
Post #8





Grupa: Zarejestrowani
Postów: 1 190
Pomógł: 27
Dołączył: 23.04.2005

Ostrzeżenie: (0%)
-----


Cytat(skali @ 14.02.2008, 17:01:25 ) *
dziala super ale mam nastepny problem. a mianowicie sztywna dlugosc div'a. jak zrobic zeby ustawic np 400px ale jak bedzie wiecej teksty to zeby nie nachodzilo na div'a znajdujacego sie nizej tylko ten dolny sie posunal troche nizej. odrazu mowie ze min-height ani 100% nie dziala



Ja bym do tego wogóle inaczej podszedł. Ale najprościej tak:

Sprawdź:
  1. #srodeklewadol {
  2. background-color: #111111;
  3. width: 470px;
  4. height: 80px;
  5. border: #777777 3px solid;
  6. padding: 7px 12px 7px 12px;
  7. margin: 300px 0 0 0;
  8. float: left;
  9. clear: both;
  10. }


EDIT: Chyba jednak nie zadziała. Jak w drugiej kolumnie jest dłuższy tekst. Szkoda że nie ma tego linku. Nie mam pewności czy to co miałem w koszu nie miało usuniętych pewnych fragmentów. Na szybko napisałem prostu układ i możesz się na tym wzorować.
Jak coś to wieczorem (jak dasz linka) to najwyżej pomogę Ci z Twoim kodem.

  1. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
  2. <html><head><title>xxx</title>
  3.  
  4.  
  5.  
  6. <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
  7. <link rel="Stylesheet" type="text/css" href="xxx/style.css"></head><body>
  8.  
  9.  
  10. <div id="container">
  11. <div id="header">Lorem ipsum dolor...Lorem ipsum dolor...Lorem ipsum dolor...Lorem ipsum dolor...Lorem ipsum dolor...</div>
  12.  
  13. <div id="content">
  14. <div id="left">Lorem ipsum dolor...Lorem ipsum dolor...Lorem ipsum dolor...Lorem ipsum dolor...Lorem ipsum dolor...</div>
  15. <div id="right">Lorem ipsum dolor...Lorem ipsum dolor...Lorem ipsum dolor...Lorem ipsum dolor...Lorem ipsum dolor...Lorem ipsum dolor...Lorem ipsum dolor...Lorem ipsum dolor...Lorem ipsum dolor...Lorem ipsum dolor...Lorem ipsum dolor...Lorem ipsum dolor...Lorem ipsum dolor...Lorem ipsum dolor...Lorem ipsum dolor...Lorem ipsum dolor...Lorem ipsum dolor...Lorem ipsum dolor...Lorem ipsum dolor...Lorem ipsum dolor...</div>
  16. <div id="lastproject">Lorem ipsum dolor...Lorem ipsum dolor...Lorem ipsum dolor...Lorem ipsum dolor...Lorem ipsum dolor...Lorem ipsum dolor...Lorem ipsum dolor...Lorem ipsum dolor...Lorem ipsum dolor...Lorem ipsum dolor...</div>
  17. </div>
  18.  
  19. <div id="footer">Lorem ipsum dolor...Lorem ipsum dolor...Lorem ipsum dolor...Lorem ipsum dolor...Lorem ipsum dolor...Lorem ipsum dolor...Lorem ipsum dolor...Lorem ipsum dolor...Lorem ipsum dolor...Lorem ipsum dolor...Lorem ipsum dolor...Lorem ipsum dolor...Lorem ipsum dolor...Lorem ipsum dolor...Lorem ipsum dolor...Lorem ipsum dolor...Lorem ipsum dolor...Lorem ipsum dolor...Lorem ipsum dolor...Lorem ipsum dolor...Lorem ipsum dolor...Lorem ipsum dolor...Lorem ipsum dolor...Lorem ipsum dolor...Lorem ipsum dolor...Lorem ipsum dolor...Lorem ipsum dolor...Lorem ipsum dolor...Lorem ipsum dolor...Lorem ipsum dolor...</div>
  20. </div>
  21.  
  22.  
  23.  
  24. </body></html>


  1. body {
  2. background-color: #000000;
  3. font-size: 11px;
  4. color: #bbbbbb;
  5. font-family: verdana, sans-serif;
  6. margin: 0 auto;
  7. background-image: url(images/bg.png);
  8. }
  9.  
  10.  
  11.  
  12. #container {margin: 0 auto;width: 900px; background-color: white;}
  13. #content {float: left;}
  14. #left {width: 300px;background-color: yellow;float: left;}
  15. #right {margin-left: 100px;width: 300px;background-color: pink;float: left;}
  16. #lastproject {width: 200px; background-color: blue; float: right;}
  17. #header {background-color: green;}
  18. #footer {background-color: red; clear: both;}


Ten post edytował Jarod 14.02.2008, 17:40:07


--------------------
”Godzina nauki w życiu nowoczesnego apostoła jest godziną modlitwy.”
(św. Josemaría Escrivá, Droga, 335)
Go to the top of the page
+Quote Post
skali
post 14.02.2008, 17:38:05
Post #9





Grupa: Zarejestrowani
Postów: 70
Pomógł: 3
Dołączył: 21.08.2006
Skąd: Zheshuv

Ostrzeżenie: (0%)
-----


Cytat(Jarod @ 14.02.2008, 17:14:16 ) *
Ps. Jak prosisz o pomoc to nie usuwaj linka. Dobrze że miałem w koszu zapisaną stronę:)

tam stopki nie bylo wiec i tak by sie nie przydalo (chyba) tongue.gif poprostu to wszystko wchodzi na stopke a jak chce zeby ten glowny div #srodek rozciagal sie razem z zawartoscia
Go to the top of the page
+Quote Post
Jarod
post 14.02.2008, 22:06:10
Post #10





Grupa: Zarejestrowani
Postów: 1 190
Pomógł: 27
Dołączył: 23.04.2005

Ostrzeżenie: (0%)
-----


Podałem Ci przykład. Dostosuj sobie do swoich potrzeb.


--------------------
”Godzina nauki w życiu nowoczesnego apostoła jest godziną modlitwy.”
(św. Josemaría Escrivá, Droga, 335)
Go to the top of the page
+Quote Post
skali
post 14.02.2008, 23:00:47
Post #11





Grupa: Zarejestrowani
Postów: 70
Pomógł: 3
Dołączył: 21.08.2006
Skąd: Zheshuv

Ostrzeżenie: (0%)
-----


Cytat(Jarod @ 14.02.2008, 22:06:10 ) *
Podałem Ci przykład. Dostosuj sobie do swoich potrzeb.

no i zrobilem, troche inymm sposobem ale jest biggrin.gif dziala jak tralala smile.gif dziekuje bardzo za zainteresowanie i pomoc
Go to the top of the page
+Quote Post

Reply to this topicStart new topic
1 Użytkowników czyta ten temat (1 Gości i 0 Anonimowych użytkowników)
0 Zarejestrowanych:

 



RSS Wersja Lo-Fi Aktualny czas: 28.04.2024 - 18:06