www.webdeveloper.com
Results 1 to 4 of 4

Thread: Fixed positioning help

Hybrid View

  1. #1
    Join Date
    Mar 2013
    Posts
    58

    Fixed positioning help

    I'm developing a mobile app for android using phone gap. Phone gap has the ability to move covert HTML into an android app. So anything that you do in HTML within reason should copy over fine. I'm trying to develop a layout for the app that involves a group of icons that need to remain in a fixed position even if the user scrolls down. I've looked around and was told this could work, but not so far for me. I'm using a CSS framework. Not sure if that helps.

    Code:
    <style type="text/css">
    body {
    	background-color: #384c57;
    }
    body,td,th {
    	color: #FFF;
    }
    
    .icons{
    	position:absolute;	
    }
    </style>
    <script
    //Scripty stuffs
    </script>
    
    </head>
    
    <body text="#FFFFFF">
    
    <div class="span-1 last" style="width:90%; height:5%"> &nbsp; </div>
    
    <div id="optionIcons icon" class="span-2" style="height:auto"> 
    	<div class="span-2" align="center"> <img src="gear.png" alt="settings" /></div>
        <div class="span-2" align="center"> <img src="bookmark.png" alt="settings" /></div>
        <div class="span-2" align="center"> <img src="addMarker.png" alt="settings" /></div>
        <div class="span-2" align="center"> <img src="childsICO.png" alt="settings" /></div>
    </div> 
    
    <div>
        <div id="mapHolder" >
                <div class="span-2" style="height: 5%; "> &nbsp; </div>
      </div>
    </div>
    
    </body>
    </html>

  2. #2
    Join Date
    Jun 2013
    Posts
    4
    change
    .icons{
    position:absolute;
    }

    to


    .icons{
    position:fixed;
    }

  3. #3
    Join Date
    Mar 2013
    Posts
    58
    Wow. Thanks.

  4. #4
    Join Date
    Jun 2013
    Posts
    4
    no prob glad i can help

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
HTML5 Development Center



Recent Articles