zurück zur Startseite
  


Zurück XHTMLforum > (X)HTML und CSS > CSS
Seite neu laden 3 Div Boxen - rechte DIV BOx soll immer ganz unten sein

Antwort
 
LinkBack Themen-Optionen Ansicht
  #1 (permalink)  
Alt 20.01.2014, 16:09
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 01.08.2011
Beiträge: 9
madmaxy befindet sich auf einem aufstrebenden Ast
Standard 3 Div Boxen - rechte DIV BOx soll immer ganz unten sein

Hallo,

ich habe für eine Themenseite für Shops jeden beitrag in 3 Div Boxen geteilt.

Linke Div = Logo
Mittlere Div= text
rechte Div= Grafik "zum Shop"

so sieht meine CSS aus

Code:
/* 3 Div Boxen floaten */

.logo-links {
   width: 110px;
/* folgende min-width in Relation zu entsprechender Angabe unter .aussenrahmen (s.o.) */
   min-width: 100px;
   margin-top: 25px; 
/* margin-left-Angabe abweichend von .box02 & .box03 , ermittelt durch Trial & Error,
float-bug in IE wird in darauffolgender Definition korrigiert */
   margin-left: 5px; 
   float: left;
}
/* ab hier wird's tricky wegen IE Float-Bug, 
Hack dank Thomas Scholz; Erklärung siehe:
http://www.css-technik.de/details/107/5/CSS-Browser-Bugs.htm;
verursacht *keine* Warnung beim Validieren! */
* html .logo-links { 
/* fuer IE Win \*/
  margin-left: 1.1%;
/* */
}
.text-mitte {
  width: 500px;
/* min-width siehe .box01 */
  min-width: 300px;
  margin-top: 2px;
  margin-left: 10px;
  float: left;
  }
.button-rechts {
   width: 70px;
/* min-width siehe .box01 */
   min-width: 60px;
   margin-top: 20px;
   margin-left: 30px;
   float: left;
}
da sich der text im mittleren DIV ändern kann, wollte ich das Rechte DIV immer unten ausrichten.

Ich weiß, daß ich ein Wrapper benötige, aber wie könnte ich es am besten lösen ?

Danke vorweg für alle Tipps

mad

Geändert von madmaxy (21.01.2014 um 10:03 Uhr) Grund: GELÖST
Mit Zitat antworten
Sponsored Links
  #2 (permalink)  
Alt 20.01.2014, 17:36
Erfahrener Benutzer
XHTMLforum-Kenner
 
Registriert seit: 10.01.2010
Beiträge: 1.070
MrMurphy ist ein sehr geschätzer MenschMrMurphy ist ein sehr geschätzer MenschMrMurphy ist ein sehr geschätzer Mensch
Standard

Hallo

aus deiner Beschreibung wird dein Problem leider nicht ersichtlich und auch die Quellcodeschnipsel helfen nicht weiter. Kannst du mal ein Beispiel online stellen?

Was verstehst du zum Beispiel unter

Zitat:
wollte ich das Rechte DIV immer unten ausrichten
Soll der Inhalt das gesamte DIV ausfüllen und somit das gesamte DIV nach unten geschoben sein? Oder soll das rechte DIV genau so hoch wie das mittlere DIV sein und nur der Inhalt unten ausgerichtet sein?

Und wie verhält es sich mit dem linken DIV? Spielt dessen Größe keine Rolle?

Gruss

MrMurphy
Mit Zitat antworten
Sponsored Links
  #3 (permalink)  
Alt 20.01.2014, 19:24
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 01.08.2011
Beiträge: 9
madmaxy befindet sich auf einem aufstrebenden Ast
Standard

Hallo MrMurphy,

Ich poste mal den link zur Seite

Autoteile - Autoreifen - Motorrad

Wie du siehst ist in der linken div Box das Logo. Die Breite sollte 110 px sein.

Das rechte div wird komplett durch das Bild ausgefüllt. Und diese Rechte div box soll komplett unten ausgerichtet werden, in Bezug auf die mittlere div box ( Text).

Hoffe nun ist es verständlicher.

Lg
Mit Zitat antworten
  #4 (permalink)  
Alt 20.01.2014, 20:00
Benutzerbild von Scrooge
xXx
neuer user
 
Registriert seit: 18.01.2014
Beiträge: 15
Scrooge befindet sich auf einem aufstrebenden Ast
Standard

Zitat:
da sich der text im mittleren DIV ändern kann, wollte ich das Rechte DIV immer unten ausrichten.
Hallo, eine Möglichkeit wäre den rechten div mit Display: table-cell und den Inhalt dann mit vertical-align: bottom auszurichten.


Gruß
Scrooge
Mit Zitat antworten
  #5 (permalink)  
Alt 20.01.2014, 20:03
?!?
XHTMLforum-Kenner
 
Registriert seit: 20.03.2013
Beiträge: 1.638
explanator sorgt für eine eindrucksvolle Atmosphäreexplanator sorgt für eine eindrucksvolle Atmosphäre
Standard

Nach mehrmaligem Lesen ist mir nun klar geworden was du eigentlich meinst, die Tabelle über dem Menü, das ist kein Div sonder ein TD also ein Tabellenfeld.

Das du eine Tabelle genommen hast ist schon mal falsch. 2 Divs hätten es hier auch getan.
__________________
"Wieso ist der Code schrott, ich dachte hier seien Profis..."
Aus einem Forum.
Mit Zitat antworten
  #6 (permalink)  
Alt 20.01.2014, 20:28
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 01.08.2011
Beiträge: 9
madmaxy befindet sich auf einem aufstrebenden Ast
Standard

Hi explanator,

Ich verstehe deinen post nicht. Was für eine Tabelle?
Ich nutze doch gar keine Tabelle um die Shop Beiträge zu veröffentlichen.
Mit Zitat antworten
  #7 (permalink)  
Alt 20.01.2014, 21:56
?!?
XHTMLforum-Kenner
 
Registriert seit: 20.03.2013
Beiträge: 1.638
explanator sorgt für eine eindrucksvolle Atmosphäreexplanator sorgt für eine eindrucksvolle Atmosphäre
Standard

Zitat:
Zitat von madmaxy Beitrag anzeigen
Wie du siehst ist in der linken div Box das Logo.
http://www.kauf-auf-rechnung24.com/bilder/logo.png

im Quelltext hier zu finden:
HTML-Code:
<a id="logo" href="http://www.kauf-auf-rechnung24.com">
<table>
<tbody>
<tr>
<td style="padding: 0;" valign="top" width="400">
<img src="/bilder/logo.png" border="0" style="margin: 0px 0 0 65px;" />
<p style="margin: 0px 0 0 45px;font-size:13px;">Sicher auf Rechnung bestellen in über 550 Markenshops !</p>
</td>
<td valign="bottom">
<p><img src="/bilder/check.png" border="0" style="margin: 0px;" /> 100 % Sicher !</p>
<p><img src="/bilder/check.png" border="0" style="margin: 0px;" /> Bekannte Shops</p>
<p><img src="/bilder/check.png" border="0" style="margin: 0px;" /> Satte Rabatte</p>
</td>
</tr>
</tbody>
</table></a>
Da du ja wahrschinlich was anderes meinst wäre es gut wenn du uns die Divs die es betrifft nennen würdest. Also Klasse oder Id der Divs.
Des weiteren kann man nur sagen das der Quelltext ziemlich mies ist und voller Fehler
--> Result for http://www.kauf-auf-rechnung24.com/autoreifen.html

Es ist besser erst mal die Fehler zu beseitigen bevor du weiter machst.
__________________
"Wieso ist der Code schrott, ich dachte hier seien Profis..."
Aus einem Forum.
Mit Zitat antworten
  #8 (permalink)  
Alt 20.01.2014, 22:15
Benutzerbild von Scrooge
xXx
neuer user
 
Registriert seit: 18.01.2014
Beiträge: 15
Scrooge befindet sich auf einem aufstrebenden Ast
Standard

Ich denke, er meint die Tabelle wo die einzelnen Teileshops aufgelistet sind. Links das jeweilige Firmenlogo, in der Mitte den Text dazu und auf der rechten Seite das Bild mit dem jeweiligen Shoplink, z.B.:

HTML-Code:
 <div class="catItemBody">
<!-- Plugins: BeforeDisplayContent -->
<!-- K2 Plugins: K2BeforeDisplayContent -->
<!-- Item introtext -->
<div class="catItemIntroText">
<div class="logo-links">
<a href="/links/?r=777" target="_blank" rel="nofollow">
<img class="logobilder" src="/bilder/autoreifen_reifen.gif" border="0" alt="Reifen.com" title="Reifen und Autoreifen" width="100" height="50" style="border: 0pt none;" />
</a>
</div>
<div class="text-mitte">
<h4>
<a href="/links/?r=777" target="_blank" rel="nofollow">reifen.com</a>
</h4>
Günstiger Reifenfachdiscounter mit einer großen Auswahl an Reifen, Felgen, Kompletträdern und Zubehör. Hier finden Sie alle relevanten Reifenmarken schnell und sicher durch eine übersichtliche Suchfunktion nach Größe und Pkw-Marke. Sie erhalten Ihre Bestellung bequem per Versand nach Hause oder Sie lassen eine Filiale oder einen Montagepartner beliefern.
<p></p>
</div>
<div class="button-rechts">
<a href="/links/?r=777" target="_blank" rel="nofollow">
<img src="/bilder/shop.gif" border="0" alt="Online günstige Reifen kaufen" title="Reifen.com" style="border: 0pt none;" />
</a>
</div>	  
</div>
<div class="clr"></div>
<!-- Plugins: AfterDisplayContent -->
<!-- K2 Plugins: K2AfterDisplayContent -->
<div class="clr"></div>
</div>
Zumindest hab ich das so verstanden.
Dann wäre evtl. auch dieser Beitrag aus der Knowledgebase lesenswert
Mit Zitat antworten
  #9 (permalink)  
Alt 20.01.2014, 23:07
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 01.08.2011
Beiträge: 9
madmaxy befindet sich auf einem aufstrebenden Ast
Standard

Scrooge hat es richtig verstanden.

Explanator: Du solltest meinen ersten Beitrag lesen, da erkläre ich doch, dass es um die div boxen geht. Habe gar die css gepostet
Mit Zitat antworten
Sponsored Links
  #10 (permalink)  
Alt 20.01.2014, 23:48
Benutzerbild von Scrooge
xXx
neuer user
 
Registriert seit: 18.01.2014
Beiträge: 15
Scrooge befindet sich auf einem aufstrebenden Ast
Standard

Naja, verstehen tu ich explanator schon.
Die Darstellung deines Problems war schon etwas rätselhaft. Den zugehörigen HTML Ausschnitt hättest du ruhig mitliefern können.
Mit Zitat antworten
Sponsored Links
Antwort

Themen-Optionen
Ansicht

Forumregeln
Es ist Ihnen nicht erlaubt, neue Themen zu verfassen.
Es ist Ihnen nicht erlaubt, auf Beiträge zu antworten.
Es ist Ihnen nicht erlaubt, Anhänge hochzuladen.
Es ist Ihnen nicht erlaubt, Ihre Beiträge zu bearbeiten.

BB-Code ist an.
Smileys sind an.
[IMG] Code ist an.
HTML-Code ist aus.
Trackbacks are an
Pingbacks are an
Refbacks are aus


Ähnliche Themen
Thema Autor Forum Antworten Letzter Beitrag
Div Box Höhe abhängig von anderer Div Box salt&indigo CSS 8 29.09.2012 13:38
DIV Höhe 100% Daniel86 CSS 12 29.07.2011 12:40
Für die absoluten CSS Freaks - Flexible, schattierte Div Box (mehrere Hintergründe) Andi22 CSS 1 21.05.2009 14:44
große objekte in div boxen (IE) mopmop CSS 3 04.04.2007 17:37
Problem mit der Wrapper Div Box Muldenbroger CSS 2 07.10.2006 13:41


Alle Zeitangaben in WEZ +2. Es ist jetzt 22:56 Uhr.