Liebe/-r Experte/-in, in einem div-tag habe ich zwei Bilder (nebeneinander) eingestellt, wobei das zweite Bild nicht an der Oberkante sondern an der Unterkante des ersten Bildes steht. Ich kann die Bilder in Dreamweaver CS3 zwar als Text behandeln und dann im div-tag zentrieren, ich krieg das rechte Bild aber nicht nach oben. Gibt es eine Lösung ohne ein zweites div-tag einzurichten?
Schon jetzt Dankeschön für jede Antwort
Mit freundlichem Gruß
Kurt
Hallo Kurt,
haben Sie den HTML Code für mich - ist einfacher, als das jetzt selbst zu probieren, da sehe ich gleich was Sache ist.
Danke sehr!
Danke zunächst für die schnelle Antwort, hier der HTML-Code
n.n.M
ACHAL-TEKKINER-ZUCHT HOFGUT HURZFURT
n. N. M
Stutfohlen
von Oglan aus der Marahuti
geb. Juni 2009
Besten Gruß
Kurt Dietl
[Bei dieser Antwort wurde das Vollzitat nachträglich automatisiert entfernt]
Liebe/-r Experte/-in,
Mahlzeit!
in einem div-tag habe ich zwei Bilder
(nebeneinander) eingestellt, wobei das zweite Bild nicht an
der Oberkante sondern an der Unterkante des ersten Bildes
steht.
Okay!
Ich kann die Bilder in Dreamweaver CS3 zwar als Text
behandeln und dann im div-tag zentrieren, ich krieg das rechte
Bild aber nicht nach oben. Gibt es eine Lösung ohne ein
zweites div-tag einzurichten?
Ja gibt es!
Als einfachste Möglichkeit erscheint mir, die beiden Bilder nebeinander floaten zu lassen. Dabei ist folgender Aufbau nötig:
CSS:
.left {
display: block;
float: left;
margin-right: 5px;
}
.right
display: block;
float: left;
}
HTML:
Nach entsprechender Definition von Div-Breite, Bildbreite, etc. sollten die beiden Bilder mit einem Abstand von 5 Pixeln nebeneinander dargestellt werden.
Schon jetzt Dankeschön für jede Antwort
Ein Freibrief für Unfreundlichkeit 
Mit freundlichem Gruß
Kurt
Herzliche Grüße!
Habe das CSS in den Head Bereich eingefügt - so sollte es auf jeden Fall klappen.
Untitled Document
#img1{
float:left;
margin:0 10px 0 0;
}
#img2{
float:left;
}
.clear{
line-height:0px; font-size:0px; clear:both; height:0px; }
ACHAL-TEKKINER-ZUCHT HOFGUT HURZFURT
n. N. M
Stutfohlen
von Oglan aus der Marahuti
geb. Juni 2009
Hallo, Martin, ich danke Ihnen, wird gleich ausprobiert.
Mit freundlichem Gruß
Kurt
Klasse und ganz herzlichen Dank
Besten Gruß
Kurt
Hallo Kurt,
dem 1. Bild ein Style-Attribut hinzufügen:
float:left
Dabei muss das gesamte div mindestens so breit sein, wie beide Bilder zusammen.
Oder sollen beide Bilder nebeneinander zentriert im div-container stehen? Das geht nur mit zweitem div.
Gruß
noch einfacher ist das hinzufügen des align attributes (doctype transitional vorausgesetzt).
so werden beide bilder vertikal zentriert.
Dankeschön, wird ausprobiert
Mit freundlichem Gruß
Kurt
Dankeschön, wird ausprobiert
Mit freundlichem Gruß
Kurt.
Hallo Kurt,
hast du die Seite evtl. irgendwo online? Dann sehe ich mir mal deinen Quellcode an und kann dir sicher weiterhelfen. 
Hallo Kurt,
hast du die Seite evtl. irgendwo online? Dann sehe ich mir mal
deinen Quellcode an und kann dir sicher weiterhelfen.
Danke zunächst für die Antwort, die Seite ist noch nicht hochgeladen, der Quelltext:
n.n.M
ACHAL-TEKKINER-ZUCHT HOFGUT HURZFURT
n. N. M
Stutfohlen
von Oglan aus der Marahuti
geb. Juni 2009
und hier die CSS:
* {
margin: 0px;
padding: 0px;
}
body { color: #ff0; font-size: 1em; font-family: Helvetica, Geneva, Arial, SunSans-Regular, sans-serif; background-color: #007f00; }
p { color: #ff0; font-size: 0.8em; font-family: Helvetica, Geneva, Arial, SunSans-Regular, sans-serif; }
a {
color:#fff;
display: block;
text-decoration: none;
float: right;
height: auto;
width: 100px;
border: 1px solid #FFFF00;
text-align: center;
}
#container #titel {
font-family: Georgia, „Times New Roman“, Times, serif;
width: 1024px;
font-size: 2.05em;
font-style: italic;
line-height: 2em;
font-weight: normal;
text-align: center;
text-decoration: underline;
}
td { }
a:link {
color: #FFFFFF;
text-decoration: none;
font-family: Arial, Helvetica, sans-serif;
font-size: 0.8em;
font-style: normal;
}
a:hover {
font-style: italic;
background-color: #33FF00;
}
h1 { color: #ff0; font-size: 1.5em; font-family: Helvetica, Geneva, Arial, SunSans-Regular, sans-serif; font-weight: normal; font-style: italic; margin: 0.67em 0; }
h3 { color: #ff0; font-size: 1em; font-family: Helvetica, Geneva, Arial, SunSans-Regular, sans-serif; font-weight: bold; margin: 1em 0; }
element { position: relative; width: 10em; height: 4em; float: right; clear: none; }
#container #text {
float: left;
width: 300px;
height: auto;
padding: 0px;
margin-left: 20px;
}
#container #bild {
float: left;
width: 690px;
padding-top: 0px;
padding-right: 0px;
padding-bottom: 0px;
padding-left: 10px;
margin: 0px;
page-break-before: always;
height: auto;
}
h2 { color: #ff0; font-size: 0.6em; font-weight: normal; margin: 0.83em 0; }
#container {
height: auto;
width: 1024px;
margin-right: auto;
margin-left: auto;
}
#container #footer {
float: right;
height: auto;
width: 100px;
text-align: center;
}
.top {
float:left;
}
Hallo Kurt,
ich habe soeben deinen Quellcode bei mir auf dem Rechner getestet und mit eigenen Bildern ersetzt. Sowohl im FF 3.5, Chrome als auch IE8 werden die Bilder nebeneinander dargestellt. Dein Code passt also.
In welchem Browser hast du den Darstellungsfehler? (Bei welcher Auflösung und wie Groß sind die beiden Bilder?