Új hozzászólás Aktív témák

• #1980 CSorBA őstag adam_ #1979

  Új Válasz 2015-02-18 09:18:04 #1980

  Új hozzászólás

  Összes hozzászólása itt Válaszok az összes hozzászólására itt Válaszok erre a hozzászólásra

  Privát üzenet küldése

  

  CSorBA

  őstag

  válasz adam_ #1979 üzenetére

  Így hirtelen amit észrevettem: azt ugye tudod, hogy itt átfedés is lehet?

  /* iPads (portrait) ----------- */
  @media only screen
  and (min-device-width : 768px)
  and (max-device-width : 1024px)
  and (orientation : portrait) {
  /* Styles */
  }

  /* Desktops and laptops ----------- */
  @media only screen
  and (min-width : 1224px) {
  /* Styles */
  }

  A max-nak a következő query min-jénél kellene 1-el kisebbnek lennie, szóval:

  /* iPads (portrait) ----------- */
  @media only screen
  and (min-device-width : 768px)
  and (max-device-width : 1023px)
  and (orientation : portrait) {
  /* Styles */
  }

  /* Desktops and laptops ----------- */
  @media only screen
  and (min-width : 1224px) {
  /* Styles */
  }

  Második körben szerintem kicsit túlbonyolítod. Teljesen mindegy, hogy egy eszköz kijelzőszélessége mondjuk 320px vagy 350px. Nem fix szélességre állítjuk itt az elemeket, hanem engedjük folyni/csúszni a maximális szélességig. Sőt szerintem a and (orientation : portrait) query is felesleges.

  Szerintem nézegesd meg pl. a bootstrapot, ott elég jól el van ez találva. [link]

  Alapesetben az alábbi breakpointok vannak:

  @media (max-width: 479px) {

  @media (min-width: 479px) and (max-width: 767px) {

  @media (min-width: 768px) and (max-width: 991px) {

  @media (min-width: 992px) and (max-width: 1199px) {

  @media (min-width: 1200px) {

  ügyféllel kell megbeszélni, behatárolni, hogy mely típusú tabletekre, etc. telefonokra kellene fejleszteni,?

  Ezzel pedig nem értek egyet, kinézetet/megjelenést/dizájnt nem eszközökre fejlesztünk, hanem felbontásra. Az persze más kérdés, hogy sok eszköz teljesen más motort használ, így sajnos bizonyos css porpertyk jócskán eltérhetnek támogatottságban. Ebből egy jó kis vicces/elszomorító slide: [link]

  szerk.: Megnéztem ezt a quirktools-t, egyelőre nem látom mivel nyújtana többet mondjuk a google chrome device emulation tooljánál

Új hozzászólás Aktív témák