[Solved] Google Map Overflowing Text

[CraigC]

I am using a Google map on my homepage at http://craigcurry.com. It’s contained in a div that is 410px wide, but the Google map copyright info is displaying at a width of 636px, spilling over into another column. The styling for that text (a "span") is coming from Google and it seems "white-space:no-wrap" is the culprit, but I cannot figure out how to target it in my CSS to override Google’s. I’ve tried "overflow:hidden" on my google_map_box div but that’s not working.

Anyone have any ideas?

Code:

#google_map_box {
height: 250px;
width: 410px;
background: black;
border: 1px solid white;
margin: 10px auto;
overflow:hidden;
}

Thanks.

[CraigC]

Thanks. I am having trouble getting that to work. I don’t know my way around jquery very well. I’m not sure if I’ve put the code in the right place. It’s directly below the google map javascript right before the closing body tag. I think it should be "white-space:normal" vs. "white-space:none", so I changed that out.

On Firefox, some inline styling seems to do the trick, but doesn’t work for Safari or Chrome.

Code:

[CraigC]

A clever solution; thanks! :D

[Author]

Posts