Georgios A.

Georgios A. Product Director at
Adquesto

Temat: floaty z width:auto pod IE6

Męczę się z floatami pod IE6. Wygląda to tak jak na poniższym obrazku. Jak osiągnąć taki sam wygląd jak pod Firefoxem? Dodam, że nie mam możliwości ustawienia szerokości na sztywno. Ustawienie jakiejkolwiek wysokości nic nie daje.


Obrazek


Kod jest taki:


<!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>
<title>TEST</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<style type="text/css">
#wraper{
background: #FAFAFA;
border: 1px solid #333;
margin: 0 auto;
overflow: hidden;
padding: 20px;
width: 500px;
}
.draggable{
background: #F1F7FF;
border: 1px solid #CAE1FF;
display: inline;
float: left;
margin: 0 5px 5px 0;
padding: 3px;
width: auto;
}
.draggable p{
margin: 0;
padding: 0;
}
</style>
</head>

<body>

<div id="wraper">
<div class="draggable">
<p>a main road with fast-travelling traffic</p>
</div>
<div class="draggable">
<p>a very large bird, not able to fly</p>
</div>
<div class="draggable">
<p>very important</p>
</div>
<div class="draggable">
<p>a plant with white berries that feeds on trees</p>
</div>
<div class="draggable">
<p>breakfast and lunch combined in one meal</p>
</div>
<div class="draggable">
<p>a part of a room used for cooking</p>
</div>
</div>

</body>

</html>
Georgios A. edytował(a) ten post dnia 24.09.09 o godzinie 18:54
Bartek Stańkowski

Bartek Stańkowski front-end & mobile
web developer

Temat: floaty z width:auto pod IE6

.draggable p { white-space: nowrap }
Powinno pomóc.
Georgios A.

Georgios A. Product Director at
Adquesto

Temat: floaty z width:auto pod IE6

Niech Zeus ma Cię w opiece :) Dzięki!
Bartek Stańkowski

Bartek Stańkowski front-end & mobile
web developer

Temat: floaty z width:auto pod IE6

Nie ma sprawy. :)
Artur Kwiatkowski

Artur Kwiatkowski Front-end developer

Temat: floaty z width:auto pod IE6

było by jeszcze prościej gdybyś zamiast divów zastosował spany, z tego względu że domyślnie <div> to element blokowy natomiast <span> to element liniowy i jest inaczej wyświetlany. jak zamykasz </div> to jakbyś stawiał po nim <br /> a w przypadku </span> coś takiego nie ma miejsca ;)
Szymon Piłkowski

Szymon Piłkowski Senior JavaScript
Developer

Temat: floaty z width:auto pod IE6

Artur Kwiatkowski:
było by jeszcze prościej gdybyś zamiast divów zastosował spany, z tego względu że domyślnie <div> to element blokowy natomiast <span> to element liniowy i jest inaczej wyświetlany. jak zamykasz </div> to jakbyś stawiał po nim <br /> a w przypadku </span> coś takiego nie ma miejsca ;)


Nie wiem czy prościej, i nie wiem czy lepiej...

1. Gdyby był to tekst ciągły, to owszem, lepsze byłyby spany. Ale raczej nie jest ;) Bardziej wygląda to na chmurkę tagów. W takim razie, widziałbym tu raczej listę <ul />.

2. Akurat to, że element zachowuje się "tak jakbyś stawiał po nim <br />" nie ma nic wspólnego z semantyką, za to wiele z domyślnymi stylami CSS (display).

konto usunięte

Temat: floaty z width:auto pod IE6

Ja do końca nie wiem po co w ogóle te divy ? Chyba bez problemu da się to załatwić samymi paragrafami, lub jak wspomniał Szymon za pomocą listy. Te divy to tylko nadmiarowy kod, a chyba ogólna, najprostsza zasada jest taka: maksimum treści przy minimum kodu.

konto usunięte

Temat: floaty z width:auto pod IE6

DIVy chyba tylko po to by kolega mógł przepisać przykład zastosowania jednej z bibliotek JS;

DIV powinie być traktowany jako warstwa i kolega powinie sobie zadać pytanie czy potrzeba osobnej warstwy na każdy paragraf
Marcin Nowak

Marcin Nowak Front-end Devloper

Temat: floaty z width:auto pod IE6

Jesli dajemy float to, teoretycznie, element z automatu dostaje display:block - wiec w tym wypadku jesli chodzi o wyglad nie ma znaczenia czy to bedzie div czy span, natomiast z punktu widzenia semantyki to juz inna bajka
Tomasz Nowakowski

Tomasz Nowakowski frontend developer

Temat: floaty z width:auto pod IE6

DIV powinie być traktowany jako warstwa i kolega powinie sobie zadać pytanie czy potrzeba osobnej warstwy na każdy paragraf

Po pierwsze to od kiedy w HTML mamy warstwy? Ktoś tu chyba przegapił różnice między prezentacją (CSS), a treścią (HTML).

Po drugie <div/> i <span/> to elementy służące organizowania treści i ich użycie było prawidłowe. Jeśli by zostawić same akapity <p/> to sugerowało by, że teksty razem tworzą jakąś większą całość. Zresztą to właśnie <p/> nie mają tu sensu bo ich zawartość nie ma nic wspólnego z tym co przyjęło się określać jako akapit.

Dokumentacja nie gryzie:
http://www.w3.org/TR/1999/REC-html401-19991224/struct/...



Wyślij zaproszenie do