Div center und div aside ausrichten

Computer: Software & Programmierung HTML & CSS
#1

Hallo CSS Experten,

ich versuch seit Stunden das Div Donation und den Articel auf die selbe Höhe zu bringen.
Der Articel soll dabei in der Mitte bleiben.
Es will mir einfach nicht klappen.
Hier die Webseite dazu: http://www.bestaltmed.at/speed_reading/

Hat jemand eine Idee dazu?

Danke,
Chris

#2

wenn ich dein Anliegen richtig verstehe, kannst du dem Container „.smartDonationsDonationGeneratedItem“ ein
position: absolute;
right: 0;
mitgeben.

Gruß

#3
  1. benutze den Firefox
  2. installiere Addon Web Developer
    anschließend kannst Du damit alles ausprobieren.

Zur Lösung:

.smartDonationsDonationGeneratedItem {
1 border: 1px solid red;
2 width: 200px;
3 position: absolute;
4 right: 0px;
5 margin-top: 40px;
}

  1. zur Orientierung rahmen wir unser Objekt der Begierde erstmal ein
  2. dann vergeben wir eine breite für das Div
  3. positionieren das ganze Div absolute
  4. geben die Ausrichtung an, in diesem Falle: ganz rechts
  5. damit wir auf die Höhe der Überschrift kommen
    geben wir noch ein margin - top an.
    fertig

Pos. 1 wieder löschen.

Gruß
Christian

#4

Du hast dem Donation-Div ja noch nichts zugeordnet.

Probiere einfach mal Folgendes:

  1. Gib dem Div die Class „donation“.

  2. Schreibe in die CSS-Datei
    .donation {
    position: relative;
    top: 90px;
    }

Wenn du dem Donation-Div nichts zuordnen kannst, dann mach es einfach anders herum:

article {
position: relative;
top: -30px;
}

#5

Hi, wir sind grad im Urlaub und können grad nicht helfen. Sorry.

#6

Ist das Problem behoben? Die beiden divs sind bei mir (FF24) auf gleicher Höhe.

#7

Das Problem ist behoben.
Danke.

#8

Hallo Chris,

Ich kann eine quick&dirty-Lösung anbieten.

Du könntest das übergeordnete div für die Donation-Box mit position:absolute positionieren:

In der Datei mainStyle.css?ver=2013-07-18, (Zeile 350 ff.):

.smartDonationsDonationGeneratedItem {
 margin-top: 0px;
 position: absolute;
 right: 0px;
 top: -190px;
}

Damit erscheint sie ganz rechts oben.

Hoffe, das hilft weiter.

#9

Hi Chris,

nimm doch Firefox und die Webentwicklerkonsole, die gibt Dir schnell Aufschluss darüber, dass der Donate-Teil ein Attribut „top:30px“ hat.

Oliver