Autor Zpráva
Pavel51
Profil
Ahoj!
Doplnil jsem nahoru na stránku www.portrety.eu malý <div class="mobile-only"> obsahující jen <h1> + 4 řádky textu + 4 obrázky, aby se jednoduše zobrazily i na mobilech.
A totéž mám ještě jednou pro PC v <div class="uvod">
Prohlížeče Firefox, Chrome i Opera to pochopily a zobrazují to na monitoru PC podle mé představy - jen 1x podle divu "uvod" vycentrované.

Pouze prohlížeč SEZNAM a Edge to nepochopily, zobrazují to 2x a ještě nevycentrované, nalepené doleva!!

V CSS to mám ošéfované takto:
.mobile-only {display: none}
@media screen and (max-width: 768px) {
  .desktop-only {display: none} 
  .mobile-only {display: block}
}
.uvod
{
    width: auto;
    min-width: 400px;
    max-width: 1600px;
    margin: 0px auto 0px auto;
    background: white;
        text-align: center;
}
Předpokládám, že je nějaká chyba u mne a budu vděčen za podrobnou radu, jak to opravit, aby to pochopil i SEZNAM??

Nemám "chytrý" mobil, tak budu rád i za zprávu, že je to na mobilu i tabletu taky o.k. ?? - tedy každý jednotlivý obrázek sám pěkně na celou obrazovku mobilu a 4x se prstem posunou :-)
Díky moc!
Mlocik97
Profil
Pavel51:
toto je fakt blbý spôsob ako to riešiť.

Toto vyzerá skôr ako desktop-first riešenie.
Skorej nastavujete skrytie classy a následne to prepisujete v media query aby sa zobrazila, to nedáva logiku. @media by ste nemali používať na nastavovanie pôvodnej hodnoty.
Keeehi
Profil
Mlocik97:
Je to ale úplně jedno. Na funkčnosti to nic nemění.

Navíc toto pořadí mi přijde výhodnější. Ověřené to nemám, ale v dnešní době bude si více prohlížečů co nepodporují media queries na stolních počítačích než na mobilech. Takže fallback na desktop verzi mi přijde správný.
A hlavně přístup mobile first je spíše přístupu a prioritách než o technickém řešení.
Pavel51
Profil
Tak v rámci akcí "Pokus >> Omyl" jsem doplnil style="text-align:center" přímo do kodu bez CSS - a už se to zobrazuje všude stejně. :-)
Jenom ještě nevím, jestli funguje to moje <mobile-only> zda se na mobilech zobrazuje jeden celý obrázek na celém mobilu a prstem se tam posune další? Všechny 4 naráz by asi nebylo dobře?
Téma je možno přesunout pod jinou rubriku?

Vaše odpověď

Mohlo by se hodit


Prosím používejte diakritiku a interpunkci.

Ochrana proti spamu. Napište prosím číslo dvě-sta čtyřicet-sedm:

0