| Autor | Zpráva | ||
|---|---|---|---|
| honzaik Profil |
#1 · Zasláno: 20. 9. 2011, 23:18:20 · Upravil/a: honzaik
čau potřeboval bych radu, proč se v Opeře stránka zobrazuje správně (šedý rámeček okolo) a v mozille a ve chromu tam ten rámec je jen kolem 1. spanu. O IE nemluvě.
Potřeboval bych radu co je tam za chybu a jak jí popřípadě vyřešit. A hlavně jak tu stránku dovést do správné podoby i v IE. Obrázky tam nejsou schválně, nehrají podle mě roli. |
||
| YoSarin Profil |
#2 · Zasláno: 20. 9. 2011, 23:23:52
honzaik:
tvůj problém by mělo vyřešit přidání overflow: hidden; |
||
| jenikkozak Profil |
#3 · Zasláno: 21. 9. 2011, 10:46:58
honzaik:
overflow: hidden doporučuji i já. A dále: - Aby se ti obsah dostal na střed, použij u prvku <body> text-align: center. Vzpomínáš? - Ke zvětšování obrázků v IE 9 ti pomůže změna doctype, aby se stránka vykreslovala ve standardním režimu. - Každé id smí být na stránce pouze jednou. Tedy včetně id „praktika1_popis“. Toto id je použito navíc nesmyslně. Máš čtyři prvky, které chceš naformátova úplně stejně. Použij u nich raději třídu. - Hover efekt má jistý problém, o kterém se ti peta nezmínil - spolehlivě funguje spíše jen na odkazech. (To opět souvisí s výše uvedeným režimem prohlížeče, když se přepneš do standardního, tento rozdíl zmizí.) Proč ty obrázky zvětšuješ pomocí mizerně podporovaných vlastností? #praktika_img:hover
{
transform: scale(1.1,1.1);
-ms-transform: scale(1.1,1.1);
-webkit-transform: scale(1.1,1.1);
-o-transform: scale(1.1,1.1);
-moz-transform: scale(1.1,1.1);
}Navrhuji něco jiného. (Samozřejmě se to dá řešit velkým množstvím jiných způsobů.) Třídu paktika img bych přiřadil odkazu, který ten zvětšující se obrázek obsahuje (díky třídě se nebude opakovat id, díky přiřazení k odkazu se sníží počet problematických prohlížečů) a použil bych podporované vlastnosti: .praktika_img{width:300px;height:300px;margin:15px;display:block}
.praktika_img img{width:100%}
.praktika_img:hover{width:330px;height:330px;margin:0}Když nařazenému divu (tomu, ve kterém je odkaz s obrázkem) navíc přidáš rozměry, nebude ten spodní obrázek uskakovat ani v IE. - Dále obrázkům v odkazu nastav buď nějaký rámeček, nebo jim ho odejmi (border:0), takto si ho tam některé prohlížeče přidávají dle svého gusta, čímž dochází k tomu, že se zobrazení v nich liší. - Se zakulacenými rohy budeš mít ve verzích starších než IE 9 problém. Nenapadá mě, jak by se to v nich mohlo efektivně vyřešit, takže bych si asi řekl, že nejde o tolik důležitou záležitost, abych se s tím ve starších verzích zabýval. Tady lépe poradit nedokážu. :-/ Když už jsem tomu tvému webu věnoval tolik času, ještě ti něco poradím: Zkus využívat nadpisy. Místo <span id="praktika1_welcome"> by mohl být <h1>, místo <span id="praktika1_popis"> by mohl být nadpis druhé úrovně. Všechna ta id praktika1_1_1_div až praktika1_2_2_div vůbec nepotřebuješ. Mohou mít společného rodiče a shodné vlastnosti. Cílit v CSS na ně můžeš pomocí #id_rodice div{} |
||
| honzaik Profil |
#4 · Zasláno: 21. 9. 2011, 16:27:37 · Upravil/a: honzaik
díky za rady, ten overflow a doctype pomohl. Akorát nevím jakej je rozdíl mezi class a id, podle toho co je na webu jakpsatweb je to to samý pokud jsem to správně pochopil... příde mi to nesmyslné :D a tak bych rád věděl rozdíl
a ještě co myslíš tim #id_rodice div{} |
||
| margin Profil * |
#5 · Zasláno: 21. 9. 2011, 17:51:47
honzaik:
„Když to napíšu slovně tak to funguje. Například #9933CC nefunguje“ Zapomněl jsi ve stylech dopsat znak # před čísla barev. Pokud je prohlížeč ve quirku, funguje zápis barvy i bez povinného znaku # na začátku, ve standardním režimu prohlížeče zobrazí barvu jen se znakem # na začátku. |
||
| honzaik Profil |
#6 · Zasláno: 21. 9. 2011, 17:59:10
jj to už jsem si všiml právě proto jsem tu odpověď editoval, ale dík
|
||
| jenikkozak Profil |
#7 · Zasláno: 21. 9. 2011, 18:11:59
honzaik:
„a ještě co myslíš tim #id_rodice div{}?“ Můžeš do HTML buď napsat <div id="rodic"> <div id="prvni_potomek">Obsah prvního potomka</div> <div id="druhy_potomek">Obsah druhého potomka</div> <div id="treti_potomek">Obsah třetího potomka</div> </div> A do CSS: #prvni_potomek{color:blue}
#druhy_potomek{color:blue}
#treti_potomek{color:blue}A nebo, jak navrhuji: <div id="rodic"> <div>Obsah prvního potomka</div> <div>Obsah druhého potomka</div> <div>Obsah třetího potomka</div> </div> A do CSS: #rodic div{color:blue}To je právě případ těch čtyř nadpisů, čtyř obrázků a čtyř odkazů, které by se daly naformátovat jediným stylem. „Akorát nevím jakej je rozdíl mezi class a id, podle toho co je na webu jakpsatweb je to to samý pokud jsem to správně pochopil... příde mi to nesmyslné :D a tak bych rád věděl rozdíl“ Hodně dokáže pomoci stránka Vlastní styly. Hodně málo pomůže stránka Co je to div class a div id?* :-) |
||
| honzaik Profil |
#8 · Zasláno: 21. 9. 2011, 18:14:54
jj ale já mám u těch divů že jsou ty 2 nalevo a další dva napravo. Šlo by to udělat ze 4 do 2 ale do jednoho ne myslim
|
||
| jenikkozak Profil |
#9 · Zasláno: 21. 9. 2011, 18:16:39
honzaik:
„Šlo by to udělat ze 4 do 2 ale do jednoho ne myslim“ Použij float. Div, který se vedle těch dalších nevejde (ten třetí), se automaticky posune dolů. Čtvrtý bude opět vedle něj. |
||
| honzaik Profil |
#10 · Zasláno: 21. 9. 2011, 18:17:28
vždyt já tam mám float
#praktika1_1_1_div
{
position: relative;
float: left;
margin-left: 100px;
margin-top: 50px;
margin-bottom: 50px;
} |
||
| honzaik Profil |
#11 · Zasláno: 21. 9. 2011, 18:18:12
šlo by to udělat class pro divy nalevo a class pro divy napravo jinak už ne myslim ne?
|
||
| jenikkozak Profil |
#12 · Zasláno: 21. 9. 2011, 18:22:26
honzaik:
Dej všem shodně float:left. Pak bude fungovat to, co jsem napsal výše. |
||
| honzaik Profil |
#13 · Zasláno: 21. 9. 2011, 18:51:18
jenikkozak:
ano oni se srovnaj za sebou ale jí chci aby to bylo symetricky, |
||
| jenikkozak Profil |
#14 · Zasláno: 21. 9. 2011, 18:52:48
honzaik:
Bude to symetricky, když budou zaujímat 50 % šířky. |
||
| honzaik Profil |
#15 · Zasláno: 21. 9. 2011, 18:56:23
jj tak to jo, ale tak jako pro mě je přehlednější když udělám .praktika_left a .praktika_right a mám vystaráno
|
||
| honzaik Profil |
#16 · Zasláno: 21. 9. 2011, 21:41:00
ted bych ještě potřeboval poradit jak roztáhnout body po celý stránce (na výšku) protože ho mám popsaný do poloviny a pozadí je teda jen do poloviny stránky a repeat dělat nechci protože to vypadá hnusně. Takže jde nějak udělat aby <body> bylo prostě šírkou po celý stránce a výškou taky?
|
||
|
Časová prodleva: 13 let
|
|||
0