|
||||
Abstand eines Elementes lässt sich nicht verringern
Liebe CSS-Profis,
ich passe gerade Stylesheets in einer Wordpress-Installation mit NextGen-Galerie-Plugin an. Folgendes Problem bekomme ich seit Tagen nicht gelöst: Album 2 Gallery 2 Galleries — Hugs and Kisses Die Slideshow ordnet sich konsequent mit großem Abstand zur Oberkante bzw. unter der #sidebar an. Soweit ich sehen kann, könnte es mit der Klasse .ngg-galleryoverview zu tun haben. Nur den Fehler finde ich nicht. Weiß jemand Rat? Das würde mich überglücklich machen. Bin inzwischen etwas verzweifelt. Vielen Dank! Folgendes steht in meinem style.css: Code:
/* Theme Name: Blass2 Theme URI: http://1000ff.de/wordpress-theme-blass-english-version/ Description: Elegant and simple. Blass2 is a CSS-only theme, has a widgetized sidebar, support for gravatars, and works nicely with WordPress 2.5+. Brought to you by <a href="http://1000ff.de/">1000ff</a>. Version: 1.6.2 Tags: fixed width, two columns, widget ready, widgets, right sidebar, simple, white, clean, valid CSS, valid XHTML Author: 1000ff Author URI: http://1000ff.de/ */ /* body --------------------------------------------------*/ body { font:62.5%/1.6em helvetica, sans-serif; color:#fff; margin:0; background:black; text-align:left; } * { margin:0; padding:0; } code { font:120% helvetica, sans-serif; } h2 { font-family:helvetica, sans-serif; } /* header --------------------------------------------------*/ #header { border-top:30px solid #fff; } #header .description { float:right; color:#333; margin:45px 0 0; } #header h1 { border-bottom:3px solid #EFF8FB; margin:15px 0 0; padding:25px 25px 40px 0; } #wrapper { width:760px; margin:0 auto; } #wrapper img { border:0px; } /* header h1 (blogtitle) --------------------------------------------------*/ #header h1 { font-family: helvetica, sans-serif; font-size:3.8em; font-weight:400; color:#333; letter-spacing:-1px; margin:20px 0; } #header h1 a { text-decoration:none; color:#333; } /* navigation #nav { border-bottom:3px solid #EFF8FB; height:25px; margin:0; padding:15px 0; } #nav li { float:left; list-style:none; padding:0 10px 0 0; } #nav li a { color:#999; background:#fff; font:1.6em helvetica, sans-serif; font-weight:400; text-decoration:none; display:block; margin:1px 2px 0 0; padding:5px; } #nav li a:hover { background-color:#EFF8FB; color:#000; text-decoration:none; } #nav li a.active { background-color:#eee; color:#444; text-decoration:none; } .clear { clear:both; } --------------------------------------------------*/ /* content --------------------------------------------------*/ #content, #content2 { margin:0 190px 0 0 !important; padding:0px 20px 10px 10px; } /* content2 #content2 { margin:0 !important; padding:10px 0 0px; } ___*/ #content, #content p { line-height:19px; font-size:120%; word-spacing:1px; margin:15px 0; color:black; } #content a,#content2 a { text-decoration:underline; font-weight:bold; color:black; padding:2px 3px 2px 3px; } #content a:hover,#content2 a:hover { background-color:#000; color:#fff; text-decoration:none; padding:2px 3px 2px 3px; } #content h2, #content2 h2 { font-weight:400; line-height:30px; margin:10px 0; } #content h2 a,#content2 h2 a { text-decoration:none; border:none; padding:0px 0 !important; } #content2 a, h2, p { color:#fff; } #content .pagetitle, #content2 .pagetitle { color:red; padding:10px; } #content h1 { font:3em helvetica, sans-serif; color:#222; margin:10px 0; } #content h3 { font:2em helvetica, sans-serif; color:#222; margin:10px 0; } #content h4 { font:1.4em helvetica, sans-serif; margin:10px 0; } #content h5 { font:1.6em helvetica, sans-serif; color:#222; margin:10px 0; } #content ul,ol { font-size:120%; margin:10px 10px 10px 25px; } #content2 h3 { font:160% helvetica, sans-serif; padding:10px 0px 0px 0px; color:#fff; margin:10px 0; } #content2, #content2 p { line-height:19px; font-size:120%; word-spacing:1px; margin:15px 0; color:#fff; } #content2 .size-thumbnail { margin:10px 10px 10px 0; vertical-align:text-bottom; } #content2 ul,ol { margin:10px 10px 10px 25px; } #content3 { background:black; color:white; margin:0 190px 0 0 !important; padding:0px 20px 10px 10px; } #content3 p { font:1.2em helvetica, sans-serif; margin:10px 0; word-spacing:1px; } } #content3 h2 { font-weight:400; line-height:30px; margin:10px 0; padding:0px 0; } #content3 img, #content2 img { padding:5px; margin:3px; } .clear { clear:both; } .ngg-imagebrowser h3 { text-align:center; color:#fff !important; } /* nextgen gallery --------------------------------------------------*/ .ngg-galleryoverview { padding:0px; margin:0px; } .ngg-galleryoverview a, .ngg-galleryoverview a:hover { font: 1.2em helvetica, sans-serif; font-weight:normal !important; line-height:18px; word-spacing:2px; padding:2px !important; margin:15px 0; text-decoration:none; } .ngg-albumoverview { margin:10px; } .ngg-album { border:0px; } .ngg-albumoverview a, .ngg-albumoverview a:hover { padding:2px !important; text-decoration:none !important; } .slideshowlink { align:right; } /* blockquote + links --------------------------------------------------*/ blockquote { background:#EFF8FB; border:1px solid #ccc; margin:10px 0; padding:5px 15px; } a:hover { color:#000; text-decoration:underline; background-color:#fff; } a.more { display:block; text-align:right; color:#2F460D; text-decoration:none; margin:10px 0 0; } a.more:hover { text-decoration:underline; } /* exerpts --------------------------------------------------*/ .imgtfe { margin:0 15px 5px 0; } /* metadata under post --------------------------------------------------*/ #content .post { background:white; padding: 10px; } .post { margin:0 0 10px 0; } .pagetitle { background:#fff; } .post img { background:#ccc; border:5px solid #eee; } #content .post .info { display:none; border-bottom:1px solid #ccc; border-top:1px solid #ccc; background-color:#EFF8FB; font-size:1em; color:#333; padding:2px 3px 3px 8px; margin: 25px 0; } .date { display:none; margin: 0 0 15px 0; } .post small { margin-top:25px; } .nocomments { display:none; } #content p a { background:#fff; } /* metadata sidebar ('about this post') - ausgeblendet --------------------------------------------------*/ p.news { display:none; background:#EFF8FB; color:#333; font-size:120%; border-bottom:1px solid #ccc; border-top:1px solid #ccc; margin:10px 0 28px; padding:10px; } /* sidebar --------------------------------------------------*/ #sidebar { width:160px; float:right; padding:15px 10px 10px 10px; height:100%; } #sidebar h2 { display:none; letter-spacing:1px; font-size:1.6em; color:#fff; padding:0 0 3px; } #sidebar ul { list-style:none; margin:0 0 10px; } #sidebar li { list-style:none; padding:3px; font-size:120%; } #sidebar li a:hover { color:#000; background-color:#EFF8FB; } #sidebar input { width:102px; background:#fff; color:#444; border:1px solid #eee; font:11px helvetica, sans-serif; padding:3px; } #sidebar input:focus { background:#fff; border:1px solid #eee; } /* some input --------------------------------------------------*/ input { border:1px solid #CCC; font:11px helvetica, sans-serif; padding:3px; } input:hover { border:1px solid #262626; } input:focus { border:1px solid #262626; color:#333; } /* comments --------------------------------------------------*/ #comments { font-size:1.4em !important; color:#eee !important; padding:5px 0 0 0; } #respond { color:#fff !important; } #content #commentlist li { margin-bottom:1.5em; padding-bottom:1em; } #content .commentlist, #small p { background-color:#ccc; padding:5px; margin:0px; } #commentform { padding: 2px 0 2px 10px; background:#ccc; width:auto; text-align:left; margin:0 0 15px 0; } #commentform textarea { background:#f8f7f6; border:1px solid #d6d3d3; width:480px; font: 13px helvetica, sans-serif; } #commentform #email,#commentform #author,#commentform #url { font-size:1.1em; background:#f8f7f6; border:1px solid #d6d3d3; width:350px; } #commentform input { margin-bottom:3px; } #gravatar { align:right; } /* wp stuff --------------------------------------------------*/ .aligncenter { display:block; margin-left:auto; margin-right:auto; } .alignleft { float:left; } .alignright { float:right; } .navigation { text-align:center; font-size:120%; } .wp-caption { text-align:center; margin:0px 10px 0px 0px; } .wp-caption img { padding:0 2px 2px 0; background:#ddd; margin:0px 10px 0px 0px; } .wp-caption-dd { font-size:11px; line-height:17px; margin:0; padding:0 4px 5px; } #footer a:hover { text-decoration:none; color:#333; background:#EFF8FB; } #content li,#content2 li { border-bottom:0px solid #EFF8FB; padding:3px; } a,#sidebar li a,#footer a { color:#fff; text-decoration:none; } /* footer --------------------------------------------------*/ #footer { color:#333; margin:0; padding:20px 0; } Code:
/* CSS Name: Default Styles Description: NextGEN Default Gallery Stylesheet Author: Alex Rabe Version: 1.50 This is a template stylesheet that can be used with NextGEN Gallery. I tested the styles with a default theme Kubrick. Modify it when your theme struggle with it, it's only a template design */ /* ----------- Album Styles Extend -------------*/ .ngg-albumoverview { margin-top: 10px; width: 100%; clear:both; display:block !important; } .ngg-album { height: 100%; padding: 5px; margin-bottom: 5px; border: 1px solid #fff; } /* IE6 will ignore this , again I hate IE6 */ /* See also http://www.sitepoint.com/article/browser-specific-css-hacks */ html>body .ngg-album { overflow:hidden; padding: 5px; margin-bottom: 5px; border: 1px solid #cccccc; } .ngg-album { overflow: hidden; padding: 5px; margin-bottom: 5px; border: 1px solid #cccccc; } .ngg-albumtitle { text-align: left; font-weight: bold; margin:0px; padding:0px; font-size: 1.4em; margin-bottom: 10px; } .ngg-thumbnail { float: left; margin-right: 12px; } .ngg-thumbnail img { background-color:#FFFFFF; border:1px solid #A9A9A9; margin:4px 0px 4px 5px; padding:4px; position:relative; } .ngg-thumbnail img:hover { background-color: #A9A9A9; } .ngg-description { text-align: left; } /* ----------- Album Styles Compact -------------*/ .ngg-album-compact { float:left; height:180px; padding-right:6px !important; margin:0px !important; text-align:left; width:120px; } .ngg-album-compactbox { background:transparent url(albumset.gif) no-repeat scroll 0%; height:86px; margin:0pt 0pt 6px !important; padding:12px 0pt 0pt 7px !important; width:120px; } .ngg-album-compactbox .Thumb { border:1px solid #000000; margin:0px !important; padding:0px !important; width:91px; height:68px; } .ngg-album-compact h4 { font-size:15px; font-weight:bold; margin-bottom:0px; margin-top:0px; width:110px; } .ngg-album-compact p { font-size:11px; margin-top:2px; } /* ----------- Gallery style -------------*/ .ngg-galleryoverview { overflow: hidden; margin-top: 10px; width: 100%; clear:both; display:block !important; } .ngg-galleryoverview .desc { /* required for description */ margin:0px 10px 10px 0px; padding:5px; } .ngg-gallery-thumbnail-box { float: left; } .ngg-gallery-thumbnail { float: left; margin-right: 5px; text-align: center; } .ngg-gallery-thumbnail img { background-color:#FFFFFF; border:1px solid #A9A9A9; display:block; margin:4px 0px 4px 5px; padding:4px; position:relative; } .ngg-gallery-thumbnail img:hover { background-color: #A9A9A9; } .ngg-gallery-thumbnail span { /* Images description */ font-size:90%; padding-left:5px; display:block; } .ngg-clear { clear: both; } /* ----------- Gallery navigation -------------*/ .ngg-navigation { font-size:0.9em !important; clear:both !important; display:block !important; padding-top:15px; text-align:center; } .ngg-navigation span { font-weight:bold; margin:0pt 6px; } .ngg-navigation a.page-numbers, .ngg-navigation a.next, .ngg-navigation a.prev, .ngg-navigation span.page-numbers, .ngg-navigation span.next, .ngg-navigation span.prev { border:1px solid #DDDDDD; margin-right:3px; padding:3px 7px; } .ngg-navigation a.page-numbers:hover, .ngg-navigation a.next:hover, .ngg-navigation a.prev:hover, .ngg-navigation span.page-numbers:hover, .ngg-navigation span.next:hover, .ngg-navigation span.prev:hover { background-color: #0066CC; color: #FFFFFF !important; text-decoration: none !important; } /* ----------- Image browser style -------------*/ .ngg-imagebrowser { } .ngg-imagebrowser h3 { text-align:center; } .ngg-imagebrowser img { border:1px solid #A9A9A9; margin-top: 10px; margin-bottom: 10px; width: 100%; display:block !important; padding:5px; } .ngg-imagebrowser-nav { padding:5px; margin-left:10px; } .ngg-imagebrowser-nav .back { float:left; border:1px solid #DDDDDD; margin-right:3px; padding:3px 7px; } .ngg-imagebrowser-nav .next { float:right; border:1px solid #DDDDDD; margin-right:3px; padding:3px 7px; } .ngg-imagebrowser-nav .counter { text-align:center; font-size:0.9em !important; } .exif-data { margin-left: auto !important; margin-right: auto !important; } /* ----------- Slideshow -------------*/ .slideshow { margin-left: auto; margin-right: auto; text-align:center; outline: none; } .slideshowlink { } /* ----------- Single picture -------------*/ .ngg-singlepic { background-color:#FFFFFF; display:block; padding:4px; } .ngg-left { float: left; margin-right:10px; } .ngg-right { float: right; margin-left:10px; } .ngg-center { margin-left: auto !important; margin-right: auto !important; } /* ----------- Sidebar widget -------------*/ .ngg-widget, .ngg-widget-slideshow { overflow: hidden; margin:0pt; padding:5px 0px 0px 0pt; } .ngg-widget img { border:2px solid #A9A9A9; margin:0pt 2px 2px 0px; padding:1px; } /* ----------- Related images -------------*/ .ngg-related-gallery { background:#F9F9F9; border:1px solid #E0E0E0; overflow:hidden; margin-bottom:1em; margin-top:1em; padding:5px; } .ngg-related-gallery img { border: 1px solid #DDDDDD; float: left; margin: 0pt 3px; padding: 2px; height: 50px; width: 50px; } .ngg-related-gallery img:hover { border: 1px solid #000000; } |
Sponsored Links |
|
|||
Das Clear von .ngg-galleryoverview wirkt auf das Float der Navigation.
Einfachste Lösung: Floate auch die Inhaltsspalte. Weitere Info liefert die Suchfunktion mit "Block Formatting Context" und "Globales clear".
__________________
Corina Rudel Online-Einsteigerkurs HTML/CSS | Buch: Fortgeschrittene CSS-Techniken |
Sponsored Links |
Stichwörter |
abstand, abstand verringern, abstände |
Themen-Optionen | |
Ansicht | |
|
|
Ähnliche Themen | ||||
Thema | Autor | Forum | Antworten | Letzter Beitrag |
Attribut "Title" innerhalb des Elementes "Style": Probleme | AndreasB | (X)HTML | 15 | 28.11.2010 23:49 |
HTML Seite aufwerten,arbeitsaufwand verringern | Newbie | CSS | 2 | 06.10.2008 22:57 |
sättigung verringern | Jens.K | CSS | 4 | 26.01.2008 20:57 |
Inhalt eines Elementes zentieren (v & h) | gigi` | CSS | 1 | 06.05.2005 09:44 |
eigenschaft eines anderen elementes verändern | lomtas | CSS | 2 | 05.01.2005 13:09 |