javascript - How can I center a group of objects together in HTML with CSS? -


i have group of objects (divs) small squares can move anywhere (there's javascript function move then). squares , form figure. have figure centered css: "left: 600px" i'm trying make more responsive design page , started percents encountered 2 problems.

  1. if add percentage objects individually, when zoom in or zoom out or when resize page become more closer of far away each other.

  2. if create div including objects , add "left:50%" when click move them go instantanially 50% left. mouse -> () [spacespacescpace] / \ <- , object, i'm still selecting object. that's weird...

this html:

<div id="container"> <div class="vepart" id="me2"></div> <script type="text/javascript">     jcl.loadbehaviour("me2", moverbehaviour); </script>   <div class="vepart" id="me3"></div> <script type="text/javascript">     jcl.loadbehaviour("me3", moverbehaviour); </script>  <div class="vepart" id="me4"></div> <script type="text/javascript">     jcl.loadbehaviour("me4", moverbehaviour); </script>     <div class="vepart" id="me5"></div> <script type="text/javascript">     jcl.loadbehaviour("me5", moverbehaviour); </script></div> 

here's css:

#me2 {   content:url("some image");   top:401px;   left:0px;   z-index:5;   }  #me3 {   content:url("some image");   top:400px;   left:-58px;   z-index:5;     }  #me4 {   content:url("some image");   top:400px;   left:58px;   z-index:5;     }  #me5 {   content:url("some image");   top:500px;   left:-57px;   z-index:5;     } 

try setting position property absolute , using percentage. sounds having problem relative positioning.

#me2 {   content:url("some image");   position:absolute;   top:401px;   left:50%;   z-index:5;   } 

http://www.w3schools.com/cssref/pr_class_position.asp


Comments

Popular posts from this blog

commonjs - How to write a typescript definition file for a node module that exports a function? -

openid - Okta: Failed to get authorization code through API call -

thorough guide for profiling racket code -