Avatar
mat.masar
Člen
Avatar
mat.masar:

Ahoj, dělám rwd a a při nejmenším bodu media(480px) jsem přišel na chybu a nevím jak ji vyřešit.
Když je šířka zařízení menší než 480px tak se mají zobrazit nejmenší obrázky. Nadpis je dělaný formou obrázku ale zobrazuje se blbě. Normálně se zobrazí nad textem a i v menších zařízeních by to tak mělo být. Bohužel při tom nejmenším se zobrazuje v textu. www.minikoblizky.wz.cz

Jinak ještě tam je problém s nefunkčním menu.(Na menším rozlišení se nezobrazí vůbec což je taky divné) Nefunguje jako odkaz.

Neví někdo jak to vyřešit?

Editováno 4.10.2015 20:42
 
Odpovědět 4.10.2015 20:41
Avatar
Tomáš123
Člen
Avatar
Odpovídá na mat.masar
Tomáš123:

A jé, to je tá stránka s relatívnym poziciovaním čo minule. Radil som ti, aby si sa toho zbavil. Tu to máš. :)

Problém je riešiteľný (ale na prvý pohľad som si všimol iba rozdielny display #hornihodivu a nemám práve veľa času). Doporučujem ti zbaviť sa relatívneho poziciovania, ktoré je v tomto prípade úplne zbytočné. Spríjemníš si každú editáciu vzhľadu v budúcnosti. Relatívne poziciovaný layout nie je prispôsobivý. Ak chceš odsadiť, použi margin. Ak dva bloky vedľa seba použi float. Skĺb to, použi float a margin. Na position: relative zabudni. Je ťažké popísať na čo sa hodí a na čo už nie, ale to čo s ním stváraš ty nepatrí medzi dôvody prečo bol vytvorený.

Nahoru Odpovědět  -1 4.10.2015 21:20
Keby nebolo Internetu Exploreru, nebolo by dnešného internetu.
Avatar
mat.masar
Člen
Avatar
Odpovídá na Tomáš123
mat.masar:

Ok, mam to tam protože nevím z jakého důvodu jsem si myslel ze když chci dat margin musím dat i typ pozice. Když to oddelam pomůže to?

 
Nahoru Odpovědět 4.10.2015 21:24
Avatar
Tomáš123
Člen
Avatar
Odpovídá na mat.masar
Tomáš123:

Áno. Totiž posúvaním relatívnou pozíciou prvok zaberá okrem nového miesta, kam si ho presunul aj to pôvodné, keby nebol poziciovaný. To spôsobuje, že je nutné posunúť každý ďalší prvok a tvoriť stránky s dynamickým obsahom je ťažké na údržbu. Margin touto vlastnosťou netrpí. On zaberá iba nové miesto. Teda obsah nie je závislý na poznaní rozmerov. V tvojom prípade sa nemusíš piplať s prepočítávaním súradníc. Dáš margin, odoberieš margin, upravíš margin. Dáš float, aby boli stĺpce vedľa seba, odoberieš float aby neboli. Nastavíš šírku, odstrániš nastavenie šírky.

Nahoru Odpovědět 4.10.2015 21:30
Keby nebolo Internetu Exploreru, nebolo by dnešného internetu.
Avatar
Tomáš123
Člen
Avatar
Odpovídá na mat.masar
Tomáš123:

Samozrejme ale nemôžeš očakávať, že odoberieš position: relative a všetko sa samo zrovná. Web je nadimenzovaný. Bude potrebné ho trochu prekopať. Ale oplatí sa to urobiť pre budúcnosť.

Nahoru Odpovědět 4.10.2015 21:32
Keby nebolo Internetu Exploreru, nebolo by dnešného internetu.
Avatar
mat.masar
Člen
Avatar
Odpovídá na Tomáš123
mat.masar:

Vcelku mě tlačí čas. Bude stačit když zatím odeberu relativitu jenom #jornidiv aby de to spravilo?

 
Nahoru Odpovědět 4.10.2015 21:35
Avatar
Tomáš123
Člen
Avatar
Tomáš123:

Momentálne stačí section {top: 0}

Inak, stále si neoznačil moju odpoveď v minulej téme :)

Nahoru Odpovědět 4.10.2015 21:44
Keby nebolo Internetu Exploreru, nebolo by dnešného internetu.
Avatar
mat.masar
Člen
Avatar
Odpovídá na Tomáš123
mat.masar:

Jo v minulem vlakne jsem te neoznacil, protože mi někdo jiný pomohl hodně i mimo forum. Dneska to zkusím...jestli to bude fungovat označil te

 
Nahoru Odpovědět 5.10.2015 7:02
Avatar
adder
Člen
Avatar
adder:

Ahoj,
promiň, ale přijde mi to jako docela prasárna. Měl by sis první prostudovat nějaký základy HTML a CSS. Hned v prvním nebo 2. článku např. uvidíš, že by se mělo stylovat jenom v CSS. Taky nevím, proč na tak jednoduchou stránku máš js soubory, ale budiž (Tak ve 25. článku se dočteš, že by se měli includovat na konci dokumentu).

Ale budiž. Myslím si, že nejhorší věcí je to, že menu nejde zakliknout - je překryté sekcí. Dále máš tam obrovské množství chyb, jen na w3c - https://validator.w3.org/nu/?…

Teď k tvému problému
menu objevíš např tak, že elementu nav nastavíš display: block; a height: 100px; odděláš margin a nastavíš z-index: 10; (třeba). Je to trochu kostrbaté, ale ke kostrbatému kódu nejde vymyslet perfektní řešení. :)
od cca 740px
  • #malyhorni odděláš position: relative; top i left; #hornidiv display: none; article section postition: relative; odděláš a přidáš margin-top: 120px;

To je nejlepší řešení, které dokážu z toho tvého kódu vydolovat. Pyšný na něj nejsem.. Nauč se základy..

Nahoru Odpovědět 5.10.2015 9:25
I’m going to lay this brick as perfectly as a brick can be laid.
Avatar
Tomáš123
Člen
Avatar
Odpovídá na mat.masar
Tomáš123:

Prepáč, ja som zabudol, že problémom je nezobrazenie menu. Myslel som, že sa jedná o prekrytie nadpisu. Hm. Tak ma neoznačuj :)

Nahoru Odpovědět 5.10.2015 12:19
Keby nebolo Internetu Exploreru, nebolo by dnešného internetu.
Avatar
mat.masar
Člen
Avatar
Odpovídá na adder
mat.masar:

Díky, že jsi mi řekl co všechno tam mám špatně zvlášť po tom co jsem psal, že mě tlačí čas. Jak se na to dívám tak tam asi není jiná chyba než to, že to mám stylované v tom html. Stránka byla dělaná v tabulkách a při odstraňování tabulek jsem na toto zapomněl.

K problému... Díky, už to funguje....Na menším rozlišení ale to menu zase zmizne :-S . Na rozlišením >než 480px se tam zobrazuje i #hornidiv sice jen jako tenký proužek nahoře ale i tak. Dělá se tam mezera nad #malyhorni (předpokládám že je to tím #hornidiv).

Tomáš123 Problémy byla dva :)

Editováno 5.10.2015 15:25
 
Nahoru Odpovědět 5.10.2015 15:23
Avatar
BlugW
Redaktor
Avatar
BlugW:

Proč by nemohl mít css v html?
Proč by nemohl mít volání JS v headu nebo někde v body? Ničemu to nevadí ;)

Viz: view-source:https://www.google.cz/ , view-source:https://www.facebook.com/, view-source:https://www.youtube.com/

Nahoru Odpovědět  -1 5.10.2015 16:15
Pořiď si mac na www.appletrh.cz. Novinky a zajímavosti ze světa Apple na https://www.applemagazin.eu
Avatar
BlugW
Redaktor
Avatar
Odpovídá na mat.masar
BlugW:

mat.masar

Proč nepoužíváš PNG?

// proč nejde nahrát obrázek při editaci????

Editováno 5.10.2015 16:19
Nahoru Odpovědět 5.10.2015 16:19
Pořiď si mac na www.appletrh.cz. Novinky a zajímavosti ze světa Apple na https://www.applemagazin.eu
Avatar
BlugW
Redaktor
Avatar
BlugW:

Obrázek ...

  • máš chyby v textu(např. ne pod ale po dobré americké kávě... )

// proč se "+" mění na tečku(seznam) ? :-@

Editováno 5.10.2015 16:23
Nahoru Odpovědět 5.10.2015 16:20
Pořiď si mac na www.appletrh.cz. Novinky a zajímavosti ze světa Apple na https://www.applemagazin.eu
Avatar
mat.masar
Člen
Avatar
Odpovídá na BlugW
mat.masar:

No dobře mám tam chybu ale to není to proč jsem založil tohle vlákno...Jinak tohle je tvoje standartní rozlišení?

 
Nahoru Odpovědět 5.10.2015 16:46
Avatar
BlugW
Redaktor
Avatar
Odpovídá na mat.masar
BlugW:

Ne, zmenšil jsem to do rozměru ipadu.

Nahoru Odpovědět 5.10.2015 17:01
Pořiď si mac na www.appletrh.cz. Novinky a zajímavosti ze světa Apple na https://www.applemagazin.eu
Avatar
mat.masar
Člen
Avatar
Odpovídá na BlugW
mat.masar:

Aha, ty nemáš nějaké řešení problému?

 
Nahoru Odpovědět 5.10.2015 18:08
Avatar
adder
Člen
Avatar
Odpovídá na BlugW
adder:

ad 1)
- protože to je nepřehledné
- protože k tomu slouží .css soubor
-> http://www.smashingmagazine.com/…ml-from-css/
ad 2)
- při načítání stránky je lepší hodit nahrávání .js souborů nakonec, aby se první nahrál obsah a poté scripty
- viz. http://blog.r4ms3s.cz/…-koder-sere/

Chápu, že jsou některé styly i v html. Ale to bude většinou přidané přes js. Primárně by se tam neměli vyskytovat, jen v ojedinělých případech. Alespoň podle mého.

Nahoru Odpovědět 5.10.2015 19:34
I’m going to lay this brick as perfectly as a brick can be laid.
Děláme co je v našich silách, aby byly zdejší diskuze co nejkvalitnější. Proto do nich také mohou přispívat pouze registrovaní členové. Pro zapojení do diskuze se přihlas. Pokud ještě nemáš účet, zaregistruj se, je to zdarma.

Zobrazeno 18 zpráv z 18.