Fórum Root.cz

Hlavní témata => Vývoj => Téma založeno: ZAJDAN 14. 04. 2019, 20:23:42

Název: CSS - @media only screen
Přispěvatel: ZAJDAN 14. 04. 2019, 20:23:42

Ahoj,
potřeboval bych jeden element na webu roztáhnout na 96% pokud se zobrazí na mobilu.

Kód: [Vybrat]

.prod-container {
  width:23%;
  min-height: 30px;
  float: left;
  border-top-left-radius: 10px;
  border-top-right-radius: 10px;
  margin-right:2px;
  margin-bottom:1px;
  padding: 6px;
  padding-bottom:10px;
}

@media only screen and (max-width: 768px) {
    .prod-container {
      width:96%; 
    }
}

tohdle funguje na desktopu při zmenšení okna ale mobilní browser to ale ignoruje, zkusil jsem tedy přidat do indexové stránky
<meta name="viewport" content="width=device-width, initial-scale=1">
to ale rozhodí/smrští celou stránku

Název: Re:CSS - @media only screen
Přispěvatel: Cikáda 14. 04. 2019, 20:31:38

A na jakém telefonu to zkoušíš? Dneska už mají mobily i FullHD docela běžně...

Název: Re:CSS - @media only screen
Přispěvatel: ZAJDAN 14. 04. 2019, 20:54:18

na Sony Xperia X

Název: Re:CSS - @media only screen
Přispěvatel: Cikáda 14. 04. 2019, 22:05:17

Ta má ale 1080p. Navíc tady budeš chtít spíš dotaz na denzitu, ale z hlavy ti víc neporadím...