April 3rd, 2013, 12:35 AM
-
Table elements move!
Hello;
I have a drop down that updates a div onchange. It all works fie but for some reason the form slightly moves when It loads the button. Can anyone help me?
Code:
<div style=" width:170px">
<div id="number_of_results_text" style=" text-align:center; color:#0076cb; margin-left:20px; margin-top:0px; display:block;">
<span style="font-size:22px"><?php echo count($lookup);?></span><br />matching properties
</div>
<img alt="Submit Search" src= "images/loading.gif" id="loader_gif" style="display:none;" />
<input type="image" onClick="showstuff('loader_gif'); hidestuff('submit_this');"
id="submit_this" src="images/submit_sep_image.jpg" style="margin-left:20px; display:none; width:145px; height:45px;" alt="Submit" />
</div>
Code:
function showstuff(boxid){
document.getElementById(boxid).style.display="block";
}
function hidestuff(boxid){
document.getElementById(boxid).style.display="none";
}
April 3rd, 2013, 01:52 AM
-
add a position absolute to the styling of your input button
April 3rd, 2013, 03:25 AM
-
Originally Posted by jack13580
add a position absolute to the styling of your input button
Didn't quite work. But I appreciate your help.
April 3rd, 2013, 08:56 AM
-
add a position: absolute; and change margin-top: to -25 with your number_of_results_text div
Code:
<div id="number_of_results_text" style="text-align: center; color: rgb(0, 118, 203); margin-left: 20px; margin-top: -25px; display: none; position: absolute;">
<span style="font-size:22px">6</span><br>matching properties
</div>
also keep the position absolute on the button
Last edited by jack13580; April 3rd, 2013 at 09:16 AM.
April 3rd, 2013, 05:36 PM
-
Originally Posted by jack13580
add a position: absolute; and change margin-top: to -25 with your number_of_results_text div
Code:
<div id="number_of_results_text" style="text-align: center; color: rgb(0, 118, 203); margin-left: 20px; margin-top: -25px; display: none; position: absolute;">
<span style="font-size:22px">6</span><br>matching properties
</div>
also keep the position absolute on the button
Works beautifully. What is the lesson here?
Thank you very much
April 3rd, 2013, 07:03 PM
-
Works beautifully. What is the lesson here?
CSS is a pain and inspect element on google chrome is your friend
Last edited by jack13580; April 3rd, 2013 at 07:06 PM.