Элемент CSS, CENTERED на Картах Google

Question

У меня есть GoogleMaps на моем сайте.Моя проблема в CSS, как сделать CENTREED DIV, который расположен над Google Maps?

<div style="position:relative">
   <div style="width:300px; height:300px" id="map_localization"></div>
   <div style="position:absolute; width:100px; margin:0px auto;">CENTERED</div>
</div>

Это то, что почти работает для меня, но нужно поставить CENTEREDслой над картой

Answer 1

Можете показать какой-нибудь код?

Я бы сделал это, поместив карту и div в центр относительно относительного расположения div. Тогда я бы установил абсолютную позицию и карты, и карты внутри.

Я бы центрировал div внутри с абсолютным позиционированием: http://www.zachgraeve.com/2006/10/01/center-abosulte-position-div/

В частности, CSS для div, который будет центрироваться, будет выглядеть примерно так:

#divToBeCentered {
    width: 200px;
    position: absolute;
    left: 50%;
    margin-left: -100px;
}

---

Обновление

На самом деле, эта скрипка, которую я сделал, иллюстрирует, что я имел в виду, помещая и карту, и другой div в содержащий div:

http://jsfiddle.net/2zaxd/

Вот HTML-код (похожий на тот, что был у вас).

<div id="containerForAll">
   <div id="map_localization"></div>
   <div id="divToBeCentered">CENTERED</div>
</div>​

и CSS.

#containerForAll, #map_localization, #divToBeCentered {
 border: 1px solid #000;   
}

#containerForAll {
 position: relative; 
 width: 300px;
 height: 300px;   
}

#map_localization, #divToBeCentered {
  position: absolute;
}

#map_localization {
 width: 100%;
 height: 100%;
 top: 0;
 left: 0;
}

#divToBeCentered {
 width: 100px;
 height: 100px;
 margin-left: -50px;
 left: 50%;
 top: 50%;
 margin-top: -50px;
}

Это центрирует внутренний div над вашей картой через абсолютное позиционирование.