[html-css] divy i float

	B O A R D
	» Board » Zadaj pytanie » Archiwum » Szukaj » Stylizacja

M E N U

» Nowości

» Archiwum

» Recenzje / Testy

» Board

» Rejestracja

Szukaj @ TwojePC

	OBECNI NA TPC
	» tuptun 11:34 » hokr 11:34 » Robek 11:33 » burz 11:29 » ham_solo 11:26 » kyusi 11:25 » NimnuL 11:25 » faf 11:24 » NWN 11:22 » SebaSTS 11:21 » Sherif 11:20 » Matti 11:18 » rrafaell 11:17 » rooter666 11:13 » Flo 11:12 » JE Jacaw 11:07 » bajbusek 11:02 » Visar 11:00 » VP11 10:58 » PeKa 10:52 Dzisiaj przeczytano 41113 postów, wczoraj 25974 Szybkie ładowanie jest: włączone.

ccc

A R C H I W A L N A W I A D O M O Ś Ć

[html-css] divy i float , Bergerac 1/10/10 13:31
Witam,

Mam problemik z divami. Chcę trzy divy umieścić jeden obok drugiego poziomo, w kolejności: LOGO, BANNER, COŚ. Co robię nie tak?
(linki do zrzutu + fragmenty kodu poniżej)

http://img813.imageshack.us/...3/8003/headersv.jpg
http://img710.imageshack.us/img710/9017/htmlo.jpg
http://img213.imageshack.us/img213/6907/csslw.jpg

Barbossa: You're supposed to be dead!
Jack Sparrow: Am I not?

hmm , _oLo_1984 1/10/10 13:44
najprościej, wszystkie daj z float left, tyle że ułóż je w kolejności
header-left header-center header-right
jeżeli wymiary zgadzają się to powinno być ok. Zazwyczaj przydaje się jeszcze na koniec np. clear: left;
awake
1. Niestety , Bergerac 1/10/10 13:56
  bez zmian, tylko BANNER i COŚ zamieniły się miejscami.
  Barbossa: You're supposed to be dead!
  Jack Sparrow: Am I not?
  1. jeszcze , _oLo_1984 1/10/10 15:24
    daj wysokość dla każdego np. min-height i wtedy zobacz, jak nie to spróbuj bez h1, same divy - kurcze to musi działać :)
    awake
    1. Nie będzie bo część css jest ukryta. A może właśnie tam jest babol , Norton 1/10/10 17:20
      i tyle.
      Podany kod nie wygeneruje takiego obrazka (ramki, czcionka, kolory itp.).
      Zmień swój podpis na Boardzie
      maks 100 znaków, 3 linie,
      zabroniony spam oraz reklama
      1. hmm , _oLo_1984 1/10/10 18:01
        faktycznie, strzelam że margin, padding dla h1
        awake
        Nie , Bergerac 4/10/10 09:34
        h1 ma tylko background i text-align.
        Barbossa: You're supposed to be dead!
        Jack Sparrow: Am I not?
dodaj do , arteqw 1/10/10 13:47
header-center clear: both;
Pozdrawiam, Artur
digi-led.pl
1. Ale wtedy , Bergerac 1/10/10 13:52
  napis BANNER znajdzie się pod pozostałymi, a ja chcę na równi.
  Barbossa: You're supposed to be dead!
  Jack Sparrow: Am I not?
eee , myszon 1/10/10 14:27
display: inline dla wszystkich
1. nie pomaga , Bergerac 4/10/10 09:43
  ...
  Barbossa: You're supposed to be dead!
  Jack Sparrow: Am I not?
Tak, robisz coś nie tak. , Norton 1/10/10 14:34
Albo ciągniesz do lewej ustawiając elementy jeden po drugim. Albo cały blok nadrzędny div pozycjonuj relatywnie a następnie podrzędne divy (logo itd) absolutnie podając wys/szer/pozycję. Wtedy kolejność divów jest nieistotna bo są ustawiane nie wobec siebie tylko wobec diva nadrzędnego.
Zmień swój podpis na Boardzie
maks 100 znaków, 3 linie,
zabroniony spam oraz reklama
1. A zresztą , Norton 1/10/10 14:48
  http://paste.org/pastebin/view/23053
  Zmień swój podpis na Boardzie
  maks 100 znaków, 3 linie,
  zabroniony spam oraz reklama
  1. Robię bez pozycjonowania , Bergerac 4/10/10 11:11
    bo z wrapem na tle.
    Barbossa: You're supposed to be dead!
    Jack Sparrow: Am I not?
najprościej jak się da: , Nebuchadnezzar 1/10/10 21:30
<div style="width:900px; margin:0 auto;">
<div style="width:300px; height:300px; float:left; background:red">div lewy</div>
<div style="width:300px; height:300px; float:right; background:blue;">div prawy</div>
<div style="width:300px; height:300px; margin-left:300px; background:green;">div srodkowy</div>
</div>

na FF działa, nie wiem jak IE6 ;)
dupa na stołku, morda przy korycie...
1. No właśnie , Bergerac 4/10/10 11:28
  nie działa. Oglądało to kilku informatyków i też robią oczy.
  Barbossa: You're supposed to be dead!
  Jack Sparrow: Am I not?
  1. a domyślne wartości , myszon 4/10/10 14:37
    marginesów i paddingu wyzerowałeś? W IE może być problem z tzw. 3px float bug. Wywal width z pierwszego diva i będzie działać.
    1. Robię to pod , Bergerac 4/10/10 16:04
      FF. Potem jakiś webmastah ma to zrobić na wszystkie przeglądarki.
      Barbossa: You're supposed to be dead!
      Jack Sparrow: Am I not?
      1. po co robić 2 razy? , myszon 4/10/10 18:21
        Wystarczy że będziesz pamiętał że różne przeglądarki mają domyślnie różne wielkości marginesów i paddingów. Najłatwiej zacząć od CSSa, ktory ustawi Ci wszystkie wartości, które się mogą różnić na takie same: http://meyerweb.com/eric/tools/css/reset/ i wtedy nie robisz strony "pod FF" tylko zgodnie ze standardami.
        Wypróbuję to , Bergerac 4/10/10 22:28
        jutro w pracy :)
        Thx
        Barbossa: You're supposed to be dead!
        Jack Sparrow: Am I not?
kombinujesz jak koń pod górę , myszon 2/10/10 10:39
Pierwsze pytanie po co tam divy? Nie lepiej zamknąć te trzy elementy które chcesz umieścić obok siebie np. w div#header a potem dać styl div#header * {display: inline;}? Jeśli wali cię IE6, a powinno, to użyj display: inline-block żeby dodatkowo móc ustawić sobie szerokość i tym podobne. http://robertnyman.com/...-rocks-and-why-it-sucks/
1. Pytanie , Bergerac 4/10/10 11:29
  Czy Twoja propozycja zadziała, jeżeli w tych trzech elementach będzie grafika, film lub flash?
  Barbossa: You're supposed to be dead!
  Jack Sparrow: Am I not?
  1. a dlaczego nie? , myszon 4/10/10 14:34
    CSS definiuje ci jak to ma by wyświetlane a nie tag. Możesz tam mieć po kolei <p> <img> i <object> - nie ma problemu.
Jezu człowieku! , Norton 4/10/10 19:57
Chcesz pomocy to wstaw gdzieś źródła na serwer i przestań pitolić. Rzucasz jakimś ochłapem który trzeba przepisać z obrazka i chcesz pomocy.
Zmień swój podpis na Boardzie
maks 100 znaków, 3 linie,
zabroniony spam oraz reklama
1. Bo reszta , Bergerac 4/10/10 22:30
  jest como Dios manda, bez udziwnień, bez marginów i padów i innych formatów.
  Barbossa: You're supposed to be dead!
  Jack Sparrow: Am I not?