topic How did you construct your in Software Archive

Centering content

Samuel_G_1 — Thu, 20 Aug 2015 20:12:07 GMT

I have this:

                    <div class="grid grid-pad urow uib_row_1 row-height-1" data-uib="layout/row" data-ver="0" style="margin-left:-20px">
                        
                        <div class="col uib_col_1 col-0_12-12" data-uib="layout/col" data-ver="0" style="width:100%">
                            
                            <div class="widget-container content-area vertical-col">

                                <div class="widget uib_w_11 " data-uib="media/img" data-ver="0">
                                    
                                    <img src="images/compass.png" width="300px" height="300px" id="compassImg" >

                                    <canvas id="needleCanvas" width="300px" height="300px" style="position:absolute;top:0px;left:0px;z-index:1000;"></canvas>
                                    <img src="images/needle.png" width="300px" height="300px" id="needleImg" style="position:absolute;top:0px;left:0px;display:none;">
                                    
                                </div><span class="uib_shim"></span>
                            </div>
                           
                        </div>
                        <span class="uib_shim"></span>
                    </div>

How can I 'center' the content? If I add 'center' tags around all this, then the 'needleCanvas' is not centered due to the position:absolute...but I need that to be able to put the needle on top of the compassImg.

Hello,

Amrita_C_Intel — Fri, 21 Aug 2015 19:43:57 GMT

Hello,

This Link might be helpful-

http://stackoverflow.com/questions/29967978/position-a-row-at-center-in-xdk

Quote:Amrita C. (Intel) wrote

Samuel_G_1 — Mon, 24 Aug 2015 12:55:08 GMT

Amrita C. (Intel) wrote:

Hello,

This Link might be helpful-

http://stackoverflow.com/questions/29967978/position-a-row-at-center-in-xdk

How would I use that? Everytime I put the <center> tags, the Canvas stays positioned absolutely....

How did you construct your

Brandon_K_Intel — Mon, 24 Aug 2015 13:16:55 GMT

How did you construct your HTML? Are you using App Designer?

Forget and the like

Chris_P_Intel — Mon, 24 Aug 2015 22:39:28 GMT

Forget <center> and the like. Yikes.

In the Design view, find the 'Column' that is the parent to your image. Bring up its properties.

You can choose center alignment there.

And, if the Column has exactly one child, you can vertically center that child too