css - Whitespace is being added to an overlay in IE9, but not in Fx5 -


i'm trying overlay "search box" on google maps api v3. overlay works fine in fx5, in ie9 not work quite right. white space added ie9 between map , gray div. see difference, go to:

http://www.trailheadfinder.com/trail_search/trail_map

the "search box" should aligned map/sattelite/mytopo buttons.

html

<div id="maplayers">  select information shown:  trails: <input type="checkbox" id="trailsbox" onclick="boxclick(this,'trails')" />  campgrounds: <input type="checkbox" id="campgroundsbox" onclick="boxclick(this,'campgrounds')" />  panoramio: <input type="checkbox" id="panoramiobox" /> </div> <div>  <div id="mapsearchbar">   <input id="searchtextfield" type="text" size="50">  </div>  <div id="map" style="width: 100%; height: 500px"></div> </div> 

css

<style type="text/css"> #mapsearchbar {  float: right;  position: relative;  right: 200px;  top: 5px;  z-index: 999; } #maplayers {  padding-top: 10px;  padding-bottom: 10px;  padding-left: 10px;  margin-top: 20px;  background-color: #c4c4c4; } </style> 

the gap there because giving position of relative , offsetting using top: 5px; right: 200px. cause move leave gap in origional position. follows.

div { position: relative; }  div#mapserachbar { position: absolute; top: 5px; right: 170px; } 

and remove float:right it.


Comments

Popular posts from this blog

c# - SharpSVN - How to get the previous revision? -

c++ - Is it possible to compile a VST on linux? -

url - Querystring manipulation of email Address in PHP -