Grow your CSS skills. Land your dream job.

page not fitting within mobile window?

  • # December 4, 2012 at 9:02 pm

    Hi,

    I’m not even sure what’s happening here, but I have this movie in a div tag, and on mobile devices, the entire thing doesn’t fit within a browser window. I’ve never had this happen before. Does anyone have an idea why this isn’t working? I’ve tried adding width to the body, adding margins, etc. I can’t even get it to center let alone open correctly in a mobile browser:

    http://taylorimaging.com/clientArea/mlm_ALL03/index03.html

    any ideas would be great… trying to show the client tomorrow and I’m baffled.

    THANKS!
    DAve

    # December 4, 2012 at 9:53 pm

    Everything is wrapped in a div .shell that has a fixed width of 1630 pixels and you’ve also set the body to be 1800 pixels wide. It won’t even fit on my laptop screen (1350 pixels wide) so of course it won’t fit on much smaller screens, like mobile devices that are around 300-400 pixels wide.

    # December 5, 2012 at 6:56 am

    right, but if I remove the shell, the movie and playlist dynamically size. the problem with that is the movie doesn’t vertical align to top. I’d leave it that way but I need a shell to keep the movie aligning.

    Also, check out http://www.longtailvideo.com/jw-player for a site. Their movie has a fixed width, but even on my iPhone, this entire page will shrink to fit, just like a regular website. Mine isn’t and I can’t for the life of me figure out why. I’ve never seen this before on any site I’ve ever created before.

    thanks!!
    Dave

    # December 5, 2012 at 7:15 am

    Have you looked at Fitvid.js?

    # December 5, 2012 at 8:58 am

    single videos are never the problem. It’s this video with the playlist, and I can see right on the company home page that they are able to get this to work. What I need is some sort of div wrapper that makes it so I can see this on my html page.

    I’ve replicated what they are doing and it’s still not working, so any hints or insights would be greatly appreciated.

    THANKS!!
    Dave

    # December 5, 2012 at 8:58 am

    when I say “work” what I mean is that the video and the page in general perform like a normal web page when viewed in a mobile device. I can’t understand what I’m missing here.

    thanks-
    Dave

    # December 5, 2012 at 9:35 am

    You should definitely look into FitVid, but that aside, you might want to look into media queries, where you can set the width of the wrapper based on the screen width.

    I’m not really sure what the actual problem is until I would see it in action, so I have to guess a bit.

Viewing 7 posts - 1 through 7 (of 7 total)

You must be logged in to reply to this topic.

*May or may not contain any actual "CSS" or "Tricks".