Par dotazu k CSS pozicovani

[D_a_v_i_d]

Zdravim,
behem skoleni jsem si tak trochu hral s CSS pozicovanim, a jedno mi neni uplne jasny...

Chtel jsem nejak udelat "framy bez framu", jakz takz to funguje, do momentu, nez potrebuju nastavit vlastnost "overflow" na "auto"...

Racte porovnat tyto dve stranky

http://2001.gymjs.net/OC/css/index.php

Vypis stylu zde

#logo{background-color:blue; color:white; text-align:center; height:3em}
#navigace {float:left; width:200px;background-color:yellow; text-align:left;height:90%}
#hlavni {margin-left:201px; height:90%; overflow:auto; background-color:white}
#paticka{clear:left; background-color:silver;}

A druha (bez toho overflow:auto) zde

http://2001.gymjs.net/OC/css/verze2/index.php

Vypis CSS stylu zde

#logo{background-color:blue; color:white; text-align:center; height:3em}
#navigace {float:left; width:200px;background-color:yellow; text-align:left;height:90%}
#hlavni {margin-left:201px; height:90%; background-color:white;}
#paticka{clear:left; background-color:silver;}

1) Za boha nemuzu prijit na to, proc mi to dela pri zapnutem overflow:auto tu "diru" od leveho divu , vybarveneho zlutou barvou (text Hlavni strana je posunuty doprava)...

2) Kdyz si dam kliknout treba na PHPInfo, tak mi to pri zapnutem overflow:auto sice povoli scrollovat dolu, ale pouze tazenim za "posuvnik", da se to nejak osetrit, aby to slo koleckem/klavesnici, proste normalne? Vim, ze pes je asi zakopany v tom, ze je to delane CSS pozicovanim, zatimco u framu to jde, ale jelikoz jsem v tomhle celkem novacek, da se to nejak zaridit?

Uvital bych odpovedi zejmena na bod 1), prolezal jsem i referenci CSS 2.1, ale porad bez uspechu, proste to tam tu diru dela , dela a dela

[Skodik]

Pokud jsem to pochopil, tak zadnou diru nemam. A posouvani koleckem je stejne jako u framu, musis nejdrive kliknout do divu, ve kterem chces scrollovat.

Opera 7.54

[D_a_v_i_d]

Ve FF 1.0.6 je dira stale a posouvat koleckem nejde

Dirou myslim odsazeni textu "Hlavni stranka" od toho zluteho navigacniho divu...

EDIT : Zkousel jsem to jeste v IE 6.0 a co to dela tam, tak to radsi no comment

[jedik]

a, MOVE

b,
ad skrol,
to je vlasnost prohlizcu. Kupodivu co se tyce user friendly nejlip vychazi IE
IE-muzes v divech skrolovat aniz by se muselo preklikavat
Op-muze se skrolovat ale musis si do divu kliknout
FF-nemuze se skrolovat

Ve FF je se to da "obejit" tim ze tam das nejaky link a pak tak skrolovat pujde. Dobry co

ad dira,

Mas tam margin-left: 201px a divis se proc ti to odsazuje?


c,
Dej tomu nejaky DTD(ceka te pekne prekvapeni )

[Skodik]

ad skrol,
to je vlasnost prohlizcu. Kupodivu co se tyce user friendly nejlip vychazi IE
IE-muzes v divech skrolovat aniz by se muselo preklikavat
Op-muze se skrolovat ale musis si do divu kliknout
FF-nemuze se skrolovat

Ve FF je se to da "obejit" tim ze tam das nejaky link a pak tak skrolovat pujde. Dobry co

docela zajimave, ale nachapu jak IE prijde na to v kterem DIVu chci zkrolovat, kdyz mam 2 divy a oba maji posuvniky?

[jedik]

ad skrol,
to je vlasnost prohlizcu. Kupodivu co se tyce user friendly nejlip vychazi IE
IE-muzes v divech skrolovat aniz by se muselo preklikavat
Op-muze se skrolovat ale musis si do divu kliknout
FF-nemuze se skrolovat

Ve FF je se to da "obejit" tim ze tam das nejaky link a pak tak skrolovat pujde. Dobry co

docela zajimave, ale nachapu jak IE prijde na to v kterem DIVu chci zkrolovat, kdyz mam 2 divy a oba maji posuvniky?

No prece ten nad kterym je mys ne?

[Jezevec]

Ted mi to scroluje (DeerPark Alpha2), scroluje ti vzdy aktivni => ten na kterym stoji kurzor.

BTW: Ta paticka dole je nutna ? A ma byt velikost fixni nebo se ma posunovat ta paticka v zavislosti na velikosti obsahu ?

[Skodik]

ad skrol,
to je vlasnost prohlizcu. Kupodivu co se tyce user friendly nejlip vychazi IE
IE-muzes v divech skrolovat aniz by se muselo preklikavat
Op-muze se skrolovat ale musis si do divu kliknout
FF-nemuze se skrolovat

Ve FF je se to da "obejit" tim ze tam das nejaky link a pak tak skrolovat pujde. Dobry co

docela zajimave, ale nachapu jak IE prijde na to v kterem DIVu chci zkrolovat, kdyz mam 2 divy a oba maji posuvniky?

No prece ten nad kterym je mys ne?

aha, to je celkem chytre, ale to klikani do divu ala Opera mi vyhovuje.. nepotrebuju aby za me myslelo IE )

[D_a_v_i_d]

Sorry, s tim margin-left je to moje volovina, diky za skouknuti, je to fakt picovinka za kterou se stydim, ale delal jsem to vcera asi v pul jedny v noci, sorrac, nejak se mi to tam dostalo ani nevim jak...

2jezevec : Paticka dole nutna neni, to je jen zkouska... Kdyby byla, bylo by to OK, ale v pripade nutnosti je snadno obetovatelna Velikost by mela byt fixni a mel by scrollovat jen div "hlavni"...

K tomu scrollovani - uz jsem taky zjistil, ze je to diky prohlizeci... Holt tohle FF trosku nezvlada

BTW jediku, muzes mi poradit, respektive upresnit to "obcurani" tyhle featurky FFoxu, s tim linkem jsem to asi ne tak docela pochopil?

EDIT : Tu "paticku" vazne rusim, je to zcela zbytecna peechovinka, ktera akorat dela bordel

[Lopan]

FF je bolehlav, kdyz mas udelat nejaky web, kde na prvnim miste jeho design, tak se z toho pos....., naprosta klasika je ve FF <input /> ktery je VZDY o 1px vetsi nez mu zadas.

BTW kdyz uz pozicujes, tak sileny ojeb je border a padding, uz si nepamatuju jak to ktery browser interpretuje, ale zasadni problem je ten, ze jeden padding/border zapocita do width a druhy ne.

Tzn mas width 200px a border 1px. V jednom browseru je width naraz 202px a vnitrni prostor 200px a v druhem je stale 200px a vnitrni prostor 198px, protoze zapocita border do width.

Reseni je pres dva divy.

<div style="width&#58; 200px">
  <div style="border&#58; 1px solid black">
    aa
  </div>
</div>

A tak mas stale svou sirku 200px a vnitrni prostor 198px.

Jeste to jde resit ruznymi jinymi zpusoby, ale tento se me zda nejelegantnejsii.

[D_a_v_i_d]

Lopan diky!

To urcite taky nekdy pouziju, ale ted by me zajimalo, jak obejit to scrollovani

[jedik]

Lopan: jj to je snad nejznamejsi IE bug

David: Ono to je slozitejsi. Povesis na onclick toho DIVu JS fci, ktera focusuje prazdny <a>

Nejak jako

<div onclick="getElementById&#40;'xxx'&#41;.focus&#40;&#41;;">
<a name="xxx"></a>
...
</div>

Cetl jsem ze uz to skrolovani melo byt ve FF 1.0.4 ale nebylo. Kazdopade pokud to Deerpark dle Jezevce jiz ma tim lip

[D_a_v_i_d]

Aha... Diky JScript sice nemam rad, ale pokud je to jedina alternativa Asi to ale udelam tak, ze se to tam bude "veset" pouze v Firefoxu a zbytek necham Dik za radu, urcite to vyzkousim

[Jezevec]

Hele, a co trebas takto:

Menu bude trvale na strance a text v "block" ti bude pri rolovani zajizdet pod vrhni menu.

<body>
  
<div class="block">
nejaky hodne dlouhy text ;&#41;
</div>
<div class="top_menu">
  vrchni menu
</div>
<div class="left_menu">
  leve menu
</div>
</body>

++

.left_menu {
        position: fixed;
        text-align: center;
        overflow: hidden;
        height: 80%;
        top: 5em;
        left: 0em;
        width: 9em;
        z-index: 100;
        float: left;
        background-color: #66CC00;
}


.top_menu {
        position: fixed;
        text-align: center;
        overflow: hidden;
        height: 5em;
        width: 100%;
        left: 0em;
        top: 0em;
        z-index: 100;
        background-color: #66CC00;
}


.block {
        position: absolute;
        text-align: justify;
        top: 7em;
        left: 9em;
        margin-left: 5%;
        margin-right: 5%;
        z-index: 1;
}

[D_a_v_i_d]

Jezevec diky O necem takovym jsem premyslel taky, ale chtel jsem tonechat na vymysleni az na zitra BTW chova se to korektne ve vsech bezne uzivanych (Opera, IE, FFox...) prohlizecich, tento zpusob?

[Jezevec]

Obavam se ze v IE to bude vypadat spatne, ff i opera je OK. Predesilam, ze je to fragment validniho kodu (xhtml i css), zkratka IE neumi css.

Edit, jo, ma to jeden zajimevej vedlejsi efekt, kdyz to vrchni menu udelas pruhledny, bude pod nim text videt, takze kdyz budes postupne vrsek zpruhlednovat smerem dolu, muzes udelat "fadeout" toho textu .

[D_a_v_i_d]

zkratka IE neumi css.

Jo, to je mi jasny... Zvlast tohle mu opravdu nijak extra nejde, o tom uz jsem se presvedcil