Placing a google ad breaks my css

I had a page with the right-side layout like this one:

http://www.comehike.com/hikes/search_hiking_groups.php?redirect=yes&radius=&postal_code=

Where you can see the right side have 2 spots: the yellow buttons and the links below.

What I am trying to do is place a google ad 开发者_开发问答on that page. But the way I am doing it breaks the page. Here is an example how it is messing up the right side css:

http://www.comehike.com/hikes/search_hikes.php?redirect=yes&radius=&postal_code=

What am I doing to mess up the css? And how can I fix it?

Thank you!

Your sidebar has a fixed height, so doesn't expand to contain the new content:

.what_to_do {
    height: 210px;
}

Remove it.

Try putting it in an iframe instead. That should encapsulate the ad in its own little window which can have independent css rules.

It looks like the side bar is using class .what_to_do, which contains the rule height:210px

I would recommend: instead of setting a fixed height, clear the bottom elements if they are floating, and let it naturally be the default of height:auto;. This lets the sidebar column expand to its contents.