Nexus 5X Hidden in a Stack of 20 Devices

• 

  jalexartis · Member · Mar 19, 2016 at 11:56 am

  • Copy link
  • Add topic to favorites

  I want: “margin-left:0” for the Nexus 5X.

  To have that value assigned the device has to be seen. I have 19 of 20 devices that are seen. I have not used the Media Query the sees this device.

  Full Explanation, with images:

  My CSS:

  @media screen and (device-width: 1080px) and (device-height: 1920px) and (-webkit-device-pixel-ratio: 3) and (orientation: landscape) {
  .widget {
  /* Widget placement for NEXUS 5X in landscape mode, 03/18 */
  margin-left: 0 !important;
  width: 100% !important;
  margin-bottom: 10px;
  }
  }

  @media screen and (max-width: 908px) and (min-width: 320px) and (orientation: portrait) {
  div.site-header-main {
  /* shorten site header height so the header image moves up, 03/13 */
  height: 110px;
  }
  }

  @media screen and (max-width: 667px)and (min-width: 320px) and (orientation: landscape) {
  .widget {
  /* Widget placement for moblie device in landscape mode, 03/18 */
  margin-left: 0 !important;
  width: 100% !important;
  margin-bottom: 10px;
  }
  }

  @media screen and (max-width: 773px) and (min-width: 668px) and (orientation: landscape) {
  .widget {
  /* Widget placement for moblie device in landscape mode, REVISED 03/17 */
  margin-left: 55px !important;
  width: 100% !important;
  margin-bottom: 10px;
  }
  }

  /* iPad CODING by thesacredpath, WordPress.com Happiness Engineer, 03/16 */
  
  @media screen and (max-width: 909px) and (min-width: 708px) {
  .entry-header, .entry-summary, .entry-content, .entry-footer, .post-thumbnail {
  margin-left: 7.6923%;
  margin-right: 7.6923%;
  }

  .widget {
  /* Widget placement for iPad, NEW 03/16 */
  margin-left: 55px;
  width: 100%;
  margin-bottom: 10px;
  }
  }

  The Nexus 5X parameters are suggested from the Internet. I have used max-width:773px & min-width:411px and many other parameters to apply the widget code to set “margin-left: 0;”

  If this is solvable, I look forward to your help.

  If the Happiness Engineer is thesacredpath, I tried very hard to not have to come back so soon; but, after 2 days with this challenge, my media selector is not firing for the 5X. I am at a loss for a solution. This is a relatively new device, I do not want to blow it off.

  I am fortunate to have 19 working. With thesacredpath and Google Chrom Emulators, I have progressed. For that, I am grateful.

  Thanks!

  James

  The blog I need help with is: (visible only to logged in users)

• 

  jalexartis · Member · Mar 21, 2016 at 12:16 pm

  • Copy link

  Please disregard this support request. For reasons unknown to me my desired media query is now firing.

  @media screen and (max-width: 731px) and (min-width: 411px) and (orientation:landscape) {
  .widget {
  /* Widget placement for NEXUS 5X in landscape mode, 03/19 *STILL WORKING* */
  margin-left: 0 !important;
  width: 100% !important;
  margin-bottom: 10px;
  }
  }

  It would be good to know why the misfiring before and now okay? I’ll take it though. I tried the query above many, many times.

  According to the Google Chrome Emulator, the listed 20 devices work as desired in landscape and portrait modes.

  Thanks!

  James