.slides {
position:relative;
...
...
}
.slides li {
position:absolute;
...
...
}
Beiträge von djheke
-
-
Kopiere doch mein Code. ist nur etwas abgespeckt und funktioniert.
-
Wundert mich, daß sie überhaupt funktioniert. Oder ist es ein Kopierfehler?
HTML
Alles anzeigen<!doctype html> <html> <head> <title>navi</title> <meta charset="UTF-8"> <style> * { margin:0; padding:0; } nav { width:900px; margin:0 auto; } nav ul { list-style:none; text-align:center; background:#000; } nav li { display:inline-block; position:relative; } nav ul ul { position:absolute; left:-9999em; text-align:left; } nav li li { width:200px; } nav a { padding:10px; color:#fff; text-decoration:none; display:block; } nav a:hover{ background:#3F3F3F; color:#66cc00; } nav li:hover ul { top: auto; left: 0; } </style> </head> <body> <nav> <ul> <li><a href="index.php">Startseite</a></li> <li><a href="#">Leistungen</a> <ul> <li><a href="webdesign.php">Webdesign</a></li> <li><a href="fotodesign.php">Fotodesign</a></li> <li><a href="fotoservice.php">Fotoservice</a></li> <li><a href="cms.php">CMS</a></li> </ul> </li> <li><a href="#">Service</a> <ul> <li><a href="webspeicher.php">Hosting(Server)</a></li> <li><a href="https://webbox17.server-home.org/user" title="Kundenlogin"target="_blank">Kundenlogin</a></li> <li><a href="faq.php">Hilfe /FAQ</a></li> </ul> </li> <li><a href="kontakt.php">Kontakt</a></li> <li><a href="impressum.php">Impressum</a></li> </ul> </nav> </body> </html>
-
Wozu hast du noch ein P-Element eingeführt? So hätte es doch gereicht.
li h3 {
margin-top:50px;
padding-bottom:0.75em; /* oder 12px */
border-bottom:1px solid #000;
} -
Vielen Dank für die Mühe. Aber ich denke, ich muß mich erst in die Materie des CSS besser einarbeiten.
Wichtiger ist glaube ich HTML und dann CSS. Hier mal eine Beispiel deiner Seite.HTML
Alles anzeigen<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>Meine Fotoalben</title> <style type="text/css"> * { margin:0; padding:0; outline:none; list-style:none; text-decoration: none; } h1 a { color:#000; font-size:210%; font-weight:bold; text-decoration:underline; } h2 { font-size:large; margin-top:50px; } a:hover, a:focus { color: #F90; } body { background-color: #CDC1C5; font:100% Arial sans-serif; } #wrapper { margin:10px auto; width:60%; text-align:center; } ul { width:50%; margin:10px auto; border-bottom:1px solid #000; } li a { display:block; padding:20px; font-size:2em; font-weight:bold; border-left:1px solid #000; border-right:1px solid #000; background:#BCA9F5; } li h3 { margin-top:50px; border-bottom:1px solid #000; } </style> </head> <body> <div id="wrapper"> <h1><a href="http://www.guenter-leipfinger.de/photoalben/photoalben.html">Photoalben</a></h1> <h2>Hier finden Sie jeweils aktuelle Photoalben</h2> <ul> <li><h3>Im Augenblick:</h3></li> <li><a href="http://www.guenter-leipfinger.de/photoalben/Herbst/album/index.html">Herbst</a></li> <li><a href="http://www.guenter-leipfinger.de/photoalben/Pilze/album/index.html">Pilze</a></li> <li><a href="http://www.guenter-leipfinger.de/photoalben/Nebel/album/index.html">Nebel</a></li> <li><a href="http://www.guenter-leipfinger.de/photoalben/orchideen/album/index.html">Orchideen</a></li> </ul> </div> </body></html>
Kopieren und Testen. -
So vielleicht.
HTML
Alles anzeigen<!doctype html> <html> <head> <title>Lenovo</title> <meta charset="UTF-8"> <style> #polaroid { margin:100px 100px 10px 100px; padding:15px; float:left; position:relative; transform:rotate(4deg); background:#fff; box-shadow:0 0 4px #000; } #polaroid p { padding:5px; font-weight:bold; font-size:18px; color:#a4a; text-align:center; } #polaroid:before { content:""; position:absolute; top:15px; left:15px; width:350px; height:400px; background:rgba(150,100,0,.5); } </style> </head> <body> <div id="polaroid"> <img src="tiger.jpg" width="350" height="400"> <p>Tiger</p> </div> </body> </html>
-
Mit transform:rotate(XXdeg); kanst du Elemente drehen.
-
Lies mal hier sind 2 Teile
http://www.gipspferd.de/css/anleitung/a20/a20.php -
Zitat
djheke Danke für den Tipp, funktioniert leider nicht. Panel Body ist auch nicht betroffen.
Ich glaube doch, denn im Firebug funktioniert es. Diese Container sind nämlich höher als das umgebene Div.Dadurch rutschen darunter liegende Elemente nach rechts.
@edit: hab's nochmal probiert. Entweder im
.panel-body {
padding: 15px;
overflow:hidden;
oder
height:200px;
}
in der Bootstrap.css ändern. Dann ist das Problem gelöst. Mehr hab ich nicht gesehen.Ach, ich sehe gerade, dass du deine inline-Anweisung auch ändern musst.
.panel-body {
padding: 0!important;
height: 250px; in 200px ändern
} -
versuch mal folgende Änderung Bzw. Erweiterung
.panel-body {
padding: 15px;
overflow:hidden;
} -
Dein UL benötigt noch ein padding:0;
-
Wo ist deine Liste verschachtelt? So kann es nicht gehen. Vielleicht hilft das hier weiter.
http://www.gipspferd.de/css/anleitung/a20/a20.php -
-
Mit deiner Grafik können wir nichts anfangen. Ein Link zur Seite wär besser. Oder aber, den gesamten HTML und CSS Quelltest posten.
-
Bei friedels sind doch genügend Webhoster aufgeführt. Keine Lust zum Lesen?
-
img-map wär ja schon ein Anfang.
-
Absolute Positionierung und Margin funktioniert nunmal nicht. Also weg mit position:absolute..
-
oh man wie bekommt man diese musik abgestellt
-
Wie oft willst du noch fragen?
http://www.html.de/threads/1500px…llen-wie.52508/ -
-
Tja keine Ahnung. Jedenfalls habe ich das gewünschte Ergebnis. Alles andere ist mir Wurscht.:p
Warum fragst du eigendlich.