« 1 2
Autor Zpráva
stnly
Profil
#1 · Zasláno: 7. 4. 2007, 19:02:18
Odpovědět Citovat
Tak se mi to povedlo i bez rozdilny deklarace.
Napadlo me nastavit vysku cary 15px vsem prohlizecum a potom ji vsem spolecne vzit. Bohuzel, prez primy nastaveni height u hr to opet neslo, ie hodnotu height nenastavoval, ale jenom pricital k stavajicim 15px.
Ale pokud vysku nastavime pomoci borderu, FF, Opera hr zvetsi, ale vypada to, ze IE nerozumi. Tim padem uz jenom staci odebrat 15px vsem pomoci predchozich plovoucich prvku... a je to :-)

#left, #right {
float: left;
width: 50%;
margin-bottom: -15px;
background-color: #ffc;
}
.cleaner {
height: 0px;
border-bottom: 14px solid black;
clear: both;
visibility: hidden;
}

Zbyly kod viz viz predchozi post.
Keilew
Profil
#2 · Zasláno: 8. 4. 2007, 11:25:44 · Upravil/a: Keilew
Odpovědět Citovat
stnly

Funguje to znamenitě. Jen jsem vysledoval zásadní věc, která je nutná: oba divy musej být plaváčci, jinak v IE zaúřaduje Guillotine nebo se to tak aspoň zachová (iff plaváček delší než neplaváček).
Jo a border: 14px stačí nahradit paddingem 13px.

Otázka na Dera: objevili jsme v tomto threadu Ameriku nebo již objevené?:-))

Edited: tak jsem byl aktivní a pokusil se to sepsat: odkaz. Opravy chyb a nepřesností velice vítám! Stnly: kdo vlastně jsi?:-) Uvádím tam i tvůrce myšlenky...
stnly
Profil
#3 · Zasláno: 8. 4. 2007, 19:56:56
Odpovědět Citovat
Gilotina? vzdyt mame plovouci prvek vzdycky clearnutej na konci obalovyho, ta by se nemela objevovat.
Pravda, ten padding je sympatictejsi.
Peknej clanek, ale tezko rict, jestli sme opravdu pristali v Americe :-)
A kdo jsem? Obycejnej student, kterej si obcas rad privydelava nejakym tim kodovanim.
Keilew
Profil
#4 · Zasláno: 8. 4. 2007, 21:18:20
Odpovědět Citovat
stnly

Já myslel, jestli nemáš nějakou stránku nebo něco podobnýho:-)
Guillotine - možná to není dobrej název, ale chování je podobný. Už jsem na to jednou narazil, v jiném threadu. Asi to přejmenuju, každopádně chování je následující: iff plaváček delší než neplaváček, vyteče plaváček o těch nějakých 15px ven a v IE 6 se prostě ořízne, v IE 7 čouhá.
Vlastně se uplatní oněch -15px, ale trochu jinak, než by se očekávalo. Původně jsem si myslel, že ani záporným marginem nemůžu přetáhnout oddíl přes jeho čistič a hle, jde to, ale jen v IE. Nevím, nejsem odborník...
stnly
Profil
#5 · Zasláno: 9. 4. 2007, 13:28:56
Odpovědět Citovat
Aha, nemam nic s cim bych se rad chlubil :-)
Koukam, pri jednom plavackovi se to chova vselijak, skoda, ze to neni univerzalni reseni.
Zkusim si s tim jeste pohrat, ale pochybuju.
Keilew
Profil
#6 · Zasláno: 9. 4. 2007, 13:53:32
Odpovědět Citovat
Doufám, že to tu už brzo rozřízne Dero:-)
Univerzální řešení prostě nemusí existovat, protože zrovna toto řešení může narážet na nějakou chybu v IE. Takže ad absurdum je univerzální, ale IE není univerzální prohlížeč:-) A nebo jsem jantar a plácám tu nesmysly:-))
stnly
Profil
#7 · Zasláno: 9. 4. 2007, 19:08:59 · Upravil/a: stnly
Odpovědět Citovat
No, abych rek pravdu, tak sem se v ty univerzalite trosku ztratil :-)
Ale vypada to, ze mam reseni i pro novinovy obtekani (tj. levy plovouci, pravy float: none a obteka), tak i pro simulaci dvou sloupcu pomoci leveho plovouciho a praveho neplovouciho s dostatecne velkym levym marginem pro schovani plavacka (staci doplnit margin-left: 50% pro #pravy).
Horizontalni pravidlo zustane schovane nezavisle na tom, zda je delsi pravy, nebo levy sloupec, staci overit ctrl+koleckem, nastavil jsem fixni vysku leveho sloupce.
Jenom by me zajimalo, jestli se to v IE7 chova stejne, protoze ja nemuzu overit (W2K). 



<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

<html>

  <head>

  <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">

  <meta name="description" content="">

  <title></title>

  <style type="text/css">

    body {

      background-color: #fff;

      font: 100%/1.3 sans-serif;

      color: #000;

      padding: 1em;

    }

    * {margin: 0; padding: 0;}

    #main {

      background-color: #f00;

    }

    #mainin {

      margin-bottom: -15px;

      overflow: hidden;

    }

    #left {

      position: relative;

      float: left;

      width: 50%;

      height: 150px;

      background-color: #ffc;

    }

    #right {background-color: #cff;}

    #rightin, #leftin {padding: 2em; padding-bottom: 0;}

    .cleaner {

      height: 0;

      border: 0;

      padding-bottom: 15px;

      clear: both;

      visibility: hidden;

    }

  </style>

  </head>

  <body>

    <div id="main">

      <div id="mainin">

        <div id="left">

        <div id="leftin">

          <p>Lorem Ipsum</p>

        </div>

        </div>

        <div id="right">

        <div id="rightin">

        <p>Lorem ipsum dolor sit amet consectetuer Vestibulum Curabitur volutpat et Maecenas. Mauris at et magna vitae Pellentesque orci sem mauris et ligula. Praesent elit quis wisi nisl sollicitudin consectetuer auctor amet ridiculus id. </p>

        <p>Volutpat ipsum Integer et Nam sed dignissim pretium id nunc leo. Ut malesuada augue odio urna augue nibh tempor magna congue a. </p>

        </div>

        </div>

      </div>

    <hr class="cleaner">

    </div>

    <p>Lorem ipsum dolor sit amet&hellip;</p>

</body>

</html>
Dero
Profil
#8 · Zasláno: 9. 4. 2007, 19:36:45
Odpovědět Citovat
Bohužel se k tomuto tématu nemůžu vyjadřovat, protože se jím sám zabývám ve své připravované knize.
Keilew
Profil
#9 · Zasláno: 9. 4. 2007, 22:15:24
Odpovědět Citovat
stnly

Já to zítra v IE7 prubnu, dneska nestíhám.

Dero

Trochu nechápu souvislost.
Keilew
Profil
#10 · Zasláno: 9. 4. 2007, 22:37:34
Odpovědět Citovat
Tak mi to nedalo: IE7 stejné jako FF, gratuluju!:-) Akorát trošku nabyl počet divů, ale funguje to kvalitně. Určitě se dostaneš do Derovy knížky:-)
stnly
Profil
#11 · Zasláno: 10. 4. 2007, 13:22:01
Odpovědět Citovat
Dik za prubnuti.
Ale prosimte :-) ja stojim nohama pevne na zemi.
I kdyz Derova odpoved me docela prekvapila, abych pravdu rek, tak ted vubec nevim, co si mam myslet.
Plaváček
Profil
#12 · Zasláno: 10. 4. 2007, 13:29:44
Odpovědět Citovat
stnly

Dero píše knihu (takový neoficiální třetí díl serie - CSS kaskádové styly a CSS hotová řešení), která bude, pokud vím, obsahovat takové a podobné CSS lahůdky a specialitky.

Z jeho odpovědi soudím, že problematikou, kterou jsi nakousl, se v knize bude také zabývat a je tedy nesmysl, aby zde zveřejňoval řešení, které je připraveno k publikaci v tištěné verzi.

Vydavatel by asi nebyl štěstím bez sebe.
Keilew
Profil
#13 · Zasláno: 10. 4. 2007, 14:35:58
Odpovědět Citovat
Plaváček

No nevím, přijde mi to trošku nekolegiální. Dá se předpokládat, že já i stnly si tuto knížku koupíme tak jako tak. Bylo by hezké nám třeba aspoň na mail naznačit, zda je toto řešení správné, nemusí se to tu nutně zveřejňovat. Ale když ne, pochopím.
Upřímně se těším, až ta kniha vyjde:-)
Dero
Profil
#14 · Zasláno: 10. 4. 2007, 14:42:35
Odpovědět Citovat
Keilew: Proč nekolegiální? Každý máme svá esa v rukávu. Já si je syslím už docela dlouho, proto také může vzniknout kniha obsahující věci ohledně CSS, o kterých jste pravděpodobně nikdy neslyšeli a které pro mnohé budou překvapením (v dobrém slova smyslu).

Ptal ses mě a já jsem ze slušnosti odpověděl. Nebudu naznačovat ani na mailu, neb se tak dobře neznáme a navíc - potrubní pošta funguje všude.
Keilew
Profil
#15 · Zasláno: 10. 4. 2007, 15:00:44
Odpovědět Citovat
Dero

OK, necháme to tu otevřené a dořeší se to později. Nechtěl jsem se hádat.
Kdy vyjde ta kniha cca?
Dero
Profil
#16 · Zasláno: 10. 4. 2007, 15:08:38
Odpovědět Citovat
Keilew: Termín je někdy v druhé polovině letních prázdnin.
stnly
Profil
#17 · Zasláno: 10. 4. 2007, 15:20:23
Odpovědět Citovat
Dobre, jedine co jsme chteli, bylo vyjadreni nekoho kompetentniho (kdyz Dero nemuze, prosim Vas Plavacku), jestli to, co mi mimodek vypadlo na karetni stul je opravdu eso, nebo jenom usmudlany, pozornosti-nehodny, spodek. Diky
Dero
Profil
#18 · Zasláno: 10. 4. 2007, 15:33:35
Odpovědět Citovat
stnly: Konkrétně k Tvému řešení můžu říct tolik, že nejde o nový způsob. V některých případech je to velice dobré řešení, v jiných ho praktikovat nelze. Poradím - hledej univerzální řešení a zaměř se pouze na prvek HR. Lze to udělat.
stnly
Profil
#19 · Zasláno: 10. 4. 2007, 16:21:46
Odpovědět Citovat
Takze nekdo uz neco podobneho opravdu vymyslel?
Myslel jsem, ze prvni bylo celkem obstojne reseni plovoucich sloupcu a druhe potom pro ruzne verze obtekani, ale je mozne, ze nekde nebude pouzitelne.
Chapu tedy spravne, ze jsi prisel na univerzalni reseni obou moznosti? Jestli je tomu tak, potom naprosto chapu, ze jsi se odmital vyjadrovat a vazne dekuji za posledni radu, ale nejak diky ni ztracim chut dal badat (co kdybych na to, nedejboze, prisel) a dostavam chut si radeji pockat na tvoji knihu.
Keilew
Profil
#20 · Zasláno: 10. 4. 2007, 17:28:13
Odpovědět Citovat
Jojo, teď už to taky chápu. Jen si Dero pospěš, na září budu mít asi velkou zakázku a rád bych použil nějaký nově nastudovaný trik z Tvé knihy:-)
Časová prodleva: 5 měsíců
J
Profil *
#21 · Zasláno: 20. 9. 2007, 23:05:27
Odpovědět Citovat
Dotázek: je už ta kniha na pultech?
Časová prodleva: 17 let
« 1 2
Toto téma je uzamčeno. Odpověď nelze zaslat.

0