Newbie CSS/HTML: How to add ad in a div container to the side of the page?

Question

Hello, i got an centered website with a fixed width. Now i want to add an ad banner of fix width/height to the right side of the page. There is a wrapper div of width 700px. But i can't get my banner on my side. I dont know why. Can someone help me please with my css id? i got:

<div class="wrapper">
   <div class="head"></div>
   <div class="content"></div>
</div> //wrapper

EDIT: KLICK ME FOR AN IMAGE

This is what i want. I got the orange one. I dont want to set the banner position to the right browser border. It shout be near thw wrapper class.

Answer 1

Did you try using float: right property ?

Answer 2

If you want the banner to be inside the wrapper:

HTML

<div class="wrapper">
  <div class="banner"></div>
  <div class="head"></div>
  <div class="content"></div>
</div>

CSS

div.banner { float: right; width: 100px; height: 400px; }

If you want it outside the wrapper:

HTML

<div class="banner"></div>
<div class="wrapper">
  <div class="head"></div>
  <div class="content"></div>
</div>

CSS

div.banner { float: right; width: 100px; height: 400px; }

You can also check out this site for a bunch of different CSS/HTML layouts:

http://layouts.ironmyers.com/

Following Edit...

I think this question at Stack Overflow has what you want.

Answer 3

Go to this site and you will find the answer to your question and all the your future questions (judging by your question) http://www.w3schools.com/css/css_float.asp

Answer 4

put the give the ad-div in the wrapper-div, give it an absolute position and move it to the right. Make sure to give the wrapper-div a relative position.

html

<div id="wrapper">
<div id="ad">ad</div>
</div>

css

#wrapper{
position: relative;
}

#ad {
position: absolute;
right: -140px;
}

The wrapper div will still be centered, the ad-div will 'hang' next to it.