如何更改此框的大小？ （CSS）

Question

http://geodit.com:8000/test

If you search something. Then click a result. You'll see a white bubble pop up on the map.

How can I use CSS to over-ride this an make it smaller? It's too big!

Answer 1

If I got it right, you are talking about balloon on the map, and unfortunately you can not change its size with help of css, because balloon size is hardcoded in style attribute of balloon container (div element):

<div style="width: 247px; height: 96px;">

that can not be overriden, only with help of javascript, if you get this div you can change its size (ballonContainer refers to that div):

ballonContainer.style.width = "150px";
ballonContainer.style.height = "50px";

but you will be forced to change also other inner elements size (their size is also hardcoded in style attribute).

Update

I want the bubble to be smaller, or even disappear

well, if you don't need that balloon (aka info window), then do not create it, I just see this line in your javascript:

gInfoWindow = new google.maps.InfoWindow; 

would not it help you? Or you mean something else?

Also you can set maxWidth option of info window to limit width of that window, something like that:

gInfoWindow = new google.maps.InfoWindow( { maxWidth: 150 } );

InfoWindow options are described also here