Dojo: Div Tag Issue

Question

We are currently using Dojo to create a mobile map application. We're using Esri for the map service. Everything was working before changing from 3.2 to 3.3. The map works fine but I'm having issues implementing a base map gallery. I've done research for days trying to figure out why my gallery wasn't appearing but I've narrowed down my issue to it actually being the layout of my div tags. On my index.html page I have many div tags for different menu's and what not. I've followed all the div tags to make sure they've all been closed and they have.

So this is what I currently have implemented:

<div id="displayView" data-dojo-type="dojox.mobile.View">
    <div data-dojo-type="dojox.mobile.Heading" 
         data-dojo-props='fixed:"top", label:"Display Options", back:"Menu",
         moveTo:"menuView"'>
             <div id="galleryDiv"> </div>
    </div>
</div>

With this code, the gallery doesn't show up, but if I move the closing div tags above the div id="galleryDiv" then it the gallery will show up, but it shows up on every page of the application because there is no ending div tag. Also, we were trying to implement buttons that would move the base map images in the gallery from left to right but they only work in google chrome. I wasn't sure why it would only work in Chrome and not any other browser.

I originally had a scrollable view in it but it wouldn't show up at all so I changed it to just mobile.view and it worked. Throughout the application it interchanges view and scrollable views, but from what I've researched, it should all work regardless.

After all the research I've done, I'm pretty sure it has to do with the parent/child relationship with the div tags but I'm not sure why it would keep my gallery from showing up on one page and why when I closed the div tags it shows up. However, if I close the div tag then the gallery shows up on EVERY page.

I appreciate any and all help, ideas, and comments! So... Any ideas?...

Answer 1

So what actually ended up being the problem is that the div tag inherited it's own height at 0px. Once we gave it a height, everything showed up just fine. Now why did it give it's own height 0? No idea. Either way, it works now!