[CSS] Bild nach oben verschieben
lima-city → Forum → Die eigene Homepage → HTML, CSS & Javascript
auge
bild
boxen
code
ding
farbwahl
gleichen container
http
image
jemand
packen
position
rahmen
relative code
text
url
versuch
verzichten
-
Ich möchte auf dieser Seite[http://nilsmargotti.lima-city.de/images.php] das Bild auf der gleichen Höhe haben wie die Text-box das ganze sollte mit
position: relative;
funktionierne weil ansonsten sollte ich mehr Bilder reinstelle der große Rahmen (grau) nicht mitwächst.
ich habe es schon mit
top: -145px;
versucht aber sobald ich noch eine Textbox hinklatsche ist das bild wieder zu weit unten. -
Diskutiere mit und stelle Fragen: Jetzt kostenlos anmelden!
lima-city: Gratis werbefreier Webspace für deine eigene Homepage
-
Hey,
versuch es doch simpler mit einem
float: left;
bei dem Text und einem
float: right;
Abschließend dann noch ein
<br class="clear" />
und im CSS ein
.clear { clear: both; }
Edit:
und deine Farbwahl ist sehr extravagant (Tut mir in den Augen weh)
Beitrag zuletzt geändert: 5.5.2012 13:51:08 von karlsve -
Außerdem evtl das Bild und den Text in den gleichen Container packen
-
Funktioniert leider nicht
-
Ich möchte noch anmerken, dass deine Seite erstmal wirklich Augenkrebs verursacht! Außerdem solltest du auf javascript bei so einfahc dingen wie dem Menü oder dem Auskpalppen verzichten, jemand mit deaktivierten JAvascript guckt in die Röhre.
Das geht 100%
HTML+
CSS
<!DOCTYPE html> <html> <head> <title>Titel</title> <meta charset="UTF-8"> <meta name="description" content=""> <meta name="author" content=""> <meta name="keywords" content=""> <style> .container{ padding: 10px 10px 10px 10px; margin: 1em; width:500px; height:auto; background-color: #c0c0c0; } .text{ width:280px; height:auto; float:left; } .imgs{ width:180px; float:right; } .clear{ clear:both; }</style> </head> <body> <div class="container" > <div class="text"> <h3>Hallo</h3> <p>Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore </p> </div> <div class="imgs"> <img src="http://lorempixel.com/output/abstract-q-c-200-200-1.jpg" alt=""> </div> <br class="clear"> </div> </body> </html>
-
Diskutiere mit und stelle Fragen: Jetzt kostenlos anmelden!
lima-city: Gratis werbefreier Webspace für deine eigene Homepage
