← Back to team overview

ubuntu-webapps-bugs team mailing list archive

[Bug 1402975] Re: Wrong render of dota2.com on mako RTM #11

 

Yes, "left: 50%" on a relative element will place it in the middle of
the containing block. But in this case, the containing block is the
document element and the width of the document element is the width of
the visible viewport minus the width of the vertical scrollbar if there
is one (in this case, 341px). Testing this in responsive design mode in
Firefox and Chrome shows the same layout issue as Oxide, as expected -
note, don't turn on mobile emulation - just set the size manually. More
on this.....

The reason this works in other mobile browsers is because they set a
minimum viewport width (in Chrome for Android's case, it's 980px). We
should probably do the same in Oxide on mobile form factors to fix this.

(That doesn't change the fact that setting a margin in pixels will scale
poorly on different form factors)

** Changed in: oxide
       Status: Invalid => In Progress

** Changed in: oxide
   Importance: Undecided => Low

** Changed in: oxide
     Assignee: (unassigned) => Chris Coulson (chrisccoulson)

** Changed in: oxide
    Milestone: None => branch-1.5

-- 
You received this bug notification because you are a member of Ubuntu
WebApps bug tracking, which is subscribed to Oxide.
https://bugs.launchpad.net/bugs/1402975

Title:
  Wrong render of dota2.com on mako RTM #11

Status in Oxide Webview:
  In Progress

Bug description:
  Some page of dota2.com is rendered bad on mako RTM#11, but I'm not
  able to reproduce the same thing on desktop.

  Depending on the page, the entire page is cut on the left (like
  http://www.dota2.com/shiftingsnows), or background images are moved to
  the left (like http://blog.dota2.com)

  I think (but I'm not sure) it's about div with left property that is a child of a div with a negative marginLeft. In fact, I'm able to reproduce it on this real simple page: http://people.ubuntu.com/~rpadovani/touch/oxide/oxide.html
  The first text is cut off on the left on mako, while on every other browser I tried (chromium on desktop, android browser on phone) render it right

To manage notifications about this bug go to:
https://bugs.launchpad.net/oxide/+bug/1402975/+subscriptions


References