-1

i just need anybodys help please :( I'll try to put 2 divs next to but it wont work :(

Here the CSS:

.bookmarktrick {
    margin: 1px;
    padding: 0;
    clear: both;
}

.header {
    padding-top: 10px;
    text-align: center;
    background-color: white;
    margin: 0 auto;
    width: 20%;
    float: none;

    padding-bottom: 15px;

    -webkit-border-bottom-right-radius: 8px;
    -webkit-border-bottom-left-radius: 8px;
    -moz-border-radius-bottomright: 8px;
    -moz-border-radius-bottomleft: 8px;
    border-bottom-right-radius: 8px;
    border-bottom-left-radius: 8px;
    border-style: solid;
    border-color: white;
}

and here is the HTML:

<div class="header">Some text</div>

<div class="bookmarktrick">Hello World</div>

I want that the Bookmark div is next to the header (left or right side). The header is in the middle of the page.

Here is a Picture for understanding http://www7.pic-upload.de/04.05.14/zjsrg7ifn4ul.png

Mr. 0x50
  • 314
  • 3
  • 14
  • Next to each other, you mean? `clear: both;` seems like a weird thing to do; don't you want to `float` .bookmarktrick, instead? –  May 04 '14 at 09:59
  • http://www7.pic-upload.de/04.05.14/zjsrg7ifn4ul.png like in this picture – Mr. 0x50 May 04 '14 at 10:02
  • http://jsfiddle.net/Lrsfq/ any where near it – codefreaK May 04 '14 at 10:02
  • @deim0wl - do you want them beside each other or one aligned left and the other aligned right? – Danield May 04 '14 at 10:07
  • 1
    @Danield i want the header in the middle (with 20% width) and the bookmarktrick div right.. but in the same height as the header div – Mr. 0x50 May 04 '14 at 10:30
  • possible duplicate of [Align
    elements side by side](http://stackoverflow.com/questions/4938716/align-div-elements-side-by-side)
     – Ian Clark May 04 '14 at 10:45

2 Answers2

0

1) Switch the order of the elements in the markup like so:

<div class="bookmarktrick">Hello World</div>
<div class="header">Some text</div>

2) Set float:right on the bookmarktrick

FIDDLE

Danield
  • 121,619
  • 37
  • 226
  • 255
0

You can also just use float:left; or float:right; on both elements.