CSS der Suchfunktion anpassen

Mr_Wizzy

Hallo miteinander:razz:,

da ich die Nadel im Heuhaufen nicht finde, wäre es mir eine große Hilfe (da ich sonst den PC zum Fenster rauswerfen muss) wenn mir jemand einen Tipp geben könnte. Wenn ich in meinem Blog nach einem Stichwort suche, erscheinen Artikel und Seiten als Ergebnisse. Die Artikel-Ergebnisse werden richtig dargestellt, allerdings sind die Seiten-Ergebnisse stark nach links verschoben. Da ich nicht mehr weiterweiß, wo der Fehler liegt bin ich schon jetzt um jeden Hinweis dankbar. Da der css Code für eine Nachricht zu lang ist, ist meine gleich folgende Antwort auf diesen Artikel die zweite CSS Datei:smile:

Vielen Dank und beste Grüße,
Frank

style.css

*****

PHP

@import url("css/suckerfishoriginal.css");
@import url("css/tabs.css");


Theme Name: Webbutveckling






/* ************** GENERAL RESET ************** */
* {
        margin: 0;
        padding: 0;
}
/* CLEARFIX */
.clearfix {
        clear:both;
}
body {
        color:#000000;
        font-family:Verdana;
        font-size:12px;
        text-align:center;
        background: url(img/bg_1.png) center top no-repeat;
        line-height:1.5;
}
a {
        text-decoration:none;
        color: #000069;
}
a:hover {
        text-decoration: underline;
}
/* Headings
-------------------------------------------------------------- */
h1, h2, h3, h4, h5, h6 {
        color: #111;
        font-family: Verdana;
        font-weight: normal;
}
h1 {
        font-size: 0em;
        line-height: 1;
        margin-bottom: 0.5em;
}
h2 {
        font-size: 2em;
        margin-bottom: 0.75em;
        color:#000000;
}
h3 {
        font-size: 15px;
        color:#000000;
        font-weight:bold;
        line-height: 1;
        margin-bottom: 1em;
        margin-left: 17px;
}
h4 {
        font-size: 16px;
        font-weight:bold;
        text-decoration:none;
        line-height: 3.0;
        margin:0px 0px 0px 12px;
        text-align: center;
        border-bottom: 1px dotted #000;
}
h5 {
        font-size: 1em;
        font-weight: bold;
        margin-bottom: 1.5em;
}
h6 {
        font-size: 1em;
        font-weight: bold;
}
/* Text elements
-------------------------------------------------------------- */


p {
        margin: 0 0 1.5em;
}


ul, ol {
        margin: 0 0 1em 1em;
}
li {
        margin-left: 1.5em;
        line-height: 1.5em;
}
dt {
        font-weight: bold;
}
dd {
        margin: 0 0 1em 2em;
}
blockquote {
        margin: 1em 0 1em 1.5em;
        padding: 0 0 0 1.5em;
        font-style: italic;
        color: #666;
}
abbr, acronym {
        border-bottom: 1px dotted #666;
}
pre {
        font: 1em 'Courier New', Courier, monospace;
        white-space: pre-wrap; /* css-3 */
        white-space: -moz-pre-wrap !important; /* Mozilla, since 1999 */
        white-space: -pre-wrap; /* Opera 4-6 */
        white-space: -o-pre-wrap; /* Opera 7 */
        word-wrap: break-word; /* Internet Explorer 5.5+ */
        background-color:#E8F2FB;
        border: solid 1px #CADFEF;
        color:#333333;
        padding:10px;
        margin: 0 0 1em 0;
}
/* Tables
-------------------------------------------------------------- */


table {
        margin: 1.4em auto;
}
th {
        border-bottom: 2px solid #ccc;
        font-weight: bold;
}
td {
        border-bottom: 1px solid #ddd;
}
th, td {
        padding: 4px 10px 4px 0;
}
tfoot {
        font-style: italic;
}
caption {
        background: #000069;
        color:#ffffff;
}
/* Use this if you use span-x classes on th/td. */
table .last {
        padding-right: 0;
}
/* **************** CONTAINER *************** */


#container {
        margin:0 auto;
        padding:0;
        width:1000px;
        text-align: justify;
}
/* **************** HEADER *************** */


#header {
        height:280px;
        background: transparent url(images/header.png) no-repeat left top;
        margin:0;
        padding:0;
        width:1000px;
}
#logo {
        float:left;
        width: 470px;
        margin:24px 0 0;
}
#header a img {
        border: none;
        margin: 0;
        padding: 0;
}
#header h1 a {
        text-decoration:none;
        color:#fff;
        margin: 0 0 0 24px;
}
#header #desc {
        margin: 0 0 0 24px;
        color:#fff;
        clear:both;
}


/* **************** Content *************** */
#content {
        width:1000px;
        text-align: justify;
        clear: both;
        background:url(images/bg_content.png) repeat-y center top;
}
#main {
        float:left;
        width:680px;
        margin-left:10px;
        }
/* Search */
#searchbox {
        float: left;
        width: 250px;
        margin: 0px;
        padding: 0px;
        height: 43px;
}
#searchform {
        margin: 0px;
        padding: 0 0 6px;
        float: left;
        height: 37px;
        width: 97%;
        overflow: hidden;
}
#searchform #sbox {
        margin: 0px;
        padding: 0px;
        float: left;
        height: 26px;
        width: 100%;
}
#sbox input {
        width: 96%;
        border-width: 1px;
        float: left;
        margin: 0 0 6px;
        padding: 4px;
        color: #333333;
        font-family: Verdana;
        font-size: 11px;
}
#sbutton {
        margin: 0px;
        padding: 0px;
        float: right;
}
select {
        border:1px solid #1D1BA5;
        width:100%;
        margin: 6px 0 0 0;
}
/* SIDEBAR */
#sidebar {
        width: 300px;
        float:right;
        padding-top: 0px;
}
.widget  {
        margin: 0 0 15px 0;
        padding: 0 30px 0 0;
        list-style-type: none;
}
.widget ul, ul.sidebartabs  {
        list-style-type: none;
        padding: 0;
        margin: 0 0 10px ;
}
.sidebartabs li {
        background-image: url(images/ullibullet.png);
        background-repeat: no-repeat;
        background-position: 0 50%;
        padding: 3px 0 3px 20px;
        margin: .4em 0;
        font-size:11px;
}
.widget li {
        list-style-type: none;
        padding: 0;
        margin: 0 ;
}
#sidebar h3 {
        margin:10px 30px 0 0;
        padding: 6px 6px;
}
#sidebar .widget ul li  a  {
        display: block;
        background: transparent url(images/sidebar_grey.jpg) no-repeat left top;
        padding: 8px 8px;
        text-decoration: none;
        border-bottom: 1px dotted #000;
        font-family: Verdana;
        color:#000000;
        font-size:12px;
}
#sidebar .widget a:hover {
        background: transparent url(images/sidebar_blue.jpg) no-repeat left top;
        color: #000000;
}
#sidebar .widget ul li ul  {
        padding: 0;
        text-decoration: none;
        border-bottom: 1px dotted #000;
        margin: 0 0 8px;
}
#sidebar .widget ul li  ul li a  {
        padding: 6px 0 6px 24px ;
        text-decoration: none;
        border: none;
}
#sidebar .widget ul li ul li ul {
        padding: 0;
        text-decoration: none;
        border: none;
        margin: 0 ;
}
#sidebar .widget ul li  ul li ul li a  {
        padding: 6px 0 6px 36px ;
        text-decoration: none;
        border: none;
}
#sidebar .widget li.current_page_parent a {
        background: transparent url(images/sidebar_blue.jpg) no-repeat left top;
        color: #000000;
}
#sidebar .widget li.current_page_item a {
        background: transparent url(images/sidebar_blue.jpg) no-repeat left top;
        color: #000000;
}


/* POST */


.post {
        padding: 12px 8px 12px 30px;
        margin: 0 0 8px;
}
.post h2 {
        margin: 20px 8px 12px 6px;
        padding: 0;
        height: 60px;
        background: transparent url(images/headline.jpg) no-repeat left top;
        width: 650px;
}
.post h2 a {
        padding: 0 12px;
        line-height: 60px;
        color: #000000;
        margin-left:45px;
        text-decoration: none;
}
.sticky h2 {
        margin: 0;
        padding: 0;
        height: 40px;
        background: #970f00;
        width: 100%;
}
.post h2.pagetitle {
        text-align: left;
        padding: 0px 0px 0px 60px;
        line-height: 60px;
        color: #000000;
        }
.post .entry, .post .entrytext {
        padding:5px 12px 5px;
}
.postmetadata {
        padding: 5px 12px 0;
        clear: left;
}
.time, .category, .tags, .commenter, .author, .edit {
        padding: 0 10px 0 20px;
}
.time {
        background: url(images/calendar.gif) no-repeat 0 0;
}
.category {
        background: url(images/folder.gif) no-repeat 0 .1em;
}
.tags {
        background: url(images/tags.gif) no-repeat 0 .2em;
}
.commenter, .author {
        background: url(images/commenter.gif) no-repeat 0 .1em;
}
.edit {
        background: url(images/edit.gif) no-repeat 0 0;
}
/* .more-link {
        padding: 0 20px 0 0;
        background: url(images/comment.gif) no-repeat right .2em;
}*/


.post p {
}
.post img {
    max-width: 500px;
    height: auto;
}
code {
        font-family: Verdana;
}
.post ul, .post ol {
        list-style-type: none;
        padding: 0;
        margin: 0 0 0 1em;
}
.post ul li, .post ol li {
        background-image: url(images/ullibullet.png);
        background-repeat: no-repeat;
        background-position: 0 50%;
        padding: 3px 0 3px 20px;
        margin: .4em 0;
}

Alles anzeigen

Werbepost

Hallo!

Wenn du gerade an deiner Website arbeitest oder dein aktuelles Hosting überdenkst: Wir betreiben mit NetzLiving eine Hosting-Plattform, die speziell auf Performance, Sicherheit und einfache Verwaltung ausgelegt ist.

✔️ Schnelle Ladezeiten (optimiert für WordPress & Co.)
✔️ Deutsche Server & DSGVO-konform
✔️ Persönlicher Support (kein 0815-Ticket-System)

Mehr erfahren

Mr_Wizzy

Teil 2 & TABS.CSS

PHP

/* FOOTER */
#footer {
        padding: 0;
        margin: 0 auto;
        background: #ffffff url(images/footer.jpg) no-repeat top center;
        height: 80px;
        font-size: 11px;
        width: 1000px;
        display: table;
}
#footer p {
        text-align: center;
        padding: 15px 0 0 0;
        margin: 0;
}
/* alignment classes */
.navigation {
        display:block;
        padding: 0 24px 10px 24px;
}
.navigation .alignleft{
        width:47%;
}
.navigation .alignright{
        width:47%;
        text-align:right;
}
.floatleft, .alignleft {
   float: left;
}


.floatright, .alignright {
   float: right;
}
.center, .aligncenter {
           display: block;
           margin-left: auto;
           margin-right: auto;
        text-align:center;
}
/* Images */
img {border:0px solid #EAE9E9;padding:0px;}
img.centered { display: block; margin-left: auto; margin-right: auto;}
img, img.alignnone { margin: 0 0 0; display: inline;}
img.alignright {float: right; margin: 0 0 1.5em 1.5em; display: inline;}
img.alignleft { float: left; margin: 0 1.5em 1.5em 0; display: inline;}
.wp-caption {
        margin: 0px;
        padding: 0px;
}
.wp-caption img {
        margin: 0px 0px 10px 0px;
        padding: 0px;
        border: 0px;
}
.wp-caption p.wp-caption-text {
        margin: 0px;
        padding: 5px 0px 0px 0px;
        font-size: 10px;
        font-style: italic;
        font-weight: bold;
        line-height: 12px;
}
.navigation {
        padding: 0 24px 10px 24px;
        margin: 0;
}
.previous {
        float:left;
        margin: 7px 0px 0px 7px;
        width:47%;
}
.next {
        float:right;
        margin: 7px 0px 0px 0px;
        text-align:right;
        width:47%;
}


/* comments */
.commnavigation {
        padding: 5px 0;
        display:block;
}
#comments-template {
        clear:right;
        padding: 3px 12px 0 25px;
        margin: 15px auto 20px;
}
#commentform textarea {
        border:1px dotted #000069;
        margin:15px 0px 0px 0px;
        padding:0px;
        width:615px;
}
#commentform input {
        margin:0px 0px 0px 17px;
}
#commentform #submit {
        height: 24px;
        background: #000069;
        border: none;
        font-size: 13px;
        color: #FFFFFF;
        padding: 3px 3px;
        margin-left: 0px;
}
.commentlist li {
        clear:both;
        margin:10px 0;
        list-style: none;
}
.commentlist cite, .commentlist cite a {
        background: url(images/comment.gif) no-repeat 0 0;
        border-bottom: 1px dotted #B93F31;
        padding: 0 10px 0 20px;
}
.commentlist p {
        font-weight: normal;
        line-height: 1.5em;
        text-transform: none;
        margin: 10px 5px 10px 0;
}
#commentform p {
        font-family: 'Lucida Grande', Verdana, Arial, Sans-Serif;
        margin: 5px 0px 0px 17px;


}
.commentmetadata {
        padding: 0;
}
.alt {
        padding:5px;
        border-bottom:1px solid #b93f31;
        border-top:1px solid #b93f31;
        margin:6px 0 0;
}
.commentlist {
        padding: 0;
        margin:0px 0px 0px 17px;
}
.nocomments {
        text-align: center;
        margin: 0;
        padding: 0;
}
.avatar {
         float: right;
        margin: 0 0 0 10px;
}
/*Wp-pagenavi*/
.wp-pagenavi {
        padding:8px 12px;
        margin:12px 8px 12px 30px;
        background-color: #ffffff;
}
.wp-pagenavi a, .wp-pagenavi a:link {
        padding: 2px 4px 2px 4px;
        margin: 2px;
        text-decoration: none;
        color: #000000;
        border: 1px solid #ffffff;
}


.wp-pagenavi a:hover, .wp-pagenavi a:active {
        border: 1px solid #cccccc;
}


.wp-pagenavi span.pages {
        padding: 2px 4px 2px 4px;
        margin: 2px 2px 2px 2px;
        color: #000000;
        background-color: #ffffff;
}
.wp-pagenavi span.current {
        padding: 2px 4px 2px 4px;
        margin: 2px;
        font-weight: bold;
        color: #444444;
        border: 1px solid #cccccc;
}
.wp-pagenavi span.extend {
        padding: 2px 4px 2px 4px;
        margin: 2px;
        color: #fff;
        background-color: #E6C173;
}

Alles anzeigen

tabs.css

PHP

/* Caution! Ensure accessibility in print and other media types... */
@media projection, screen { /* Use class for showing/hiding tab content, so that visibility can be better controlled in different media types... */
#sidebar .ui-tabs-hide {
        display: none;
    }
}


/* Hide useless elements in print layouts... */
@media print {
#sidebar .ui-tabs-nav {
        display: none;
    }
}


/* Skin */
.ui-tabs-nav, .ui-tabs-panel {
    font-family: Verdana;
    font-size: 15px;
        width: 80%;
}
#sidebar ul.ui-tabs-nav {
    list-style: none;
    margin: 0;
    padding: 0 0 0 0px;
}
#sidebar ul.ui-tabs-nav:after { /* clearing without presentational markup, IE gets extra treatment */
    display: block;
    clear: both;
    content: " ";
}
#sidebar ul.ui-tabs-nav li {
    float: right;
    margin: 0 0 0 2px;
    font-weight: bold;
}
#sidebar ul.ui-tabs-nav a, #sidebar ul.ui-tabs-nav a span {
    float: right; /* fixes dir=ltr problem and other quirks IE */
    padding: 0 15px;
    background: #000069 ;
}
#sidebar ul.ui-tabs-nav a {
    margin: 0px 0 0; /* position: relative makes opacity fail for disabled tab in IE */
    padding-left: 0;
    text-decoration: none;
    white-space: nowrap; /* @ IE 6 */
    outline: 0; /* @ Firefox, prevent dotted border after click */
        border: none;
}
#sidebar ul.ui-tabs-nav a:link, #sidebar ul.ui-tabs-nav a:visited {
    color: #fff;
}
#sidebar ul.ui-tabs-nav .ui-tabs-selected a {
    position: relative;
    top: 0px;
    z-index: 2;
    margin-top: 0;
}
#sidebar ul.ui-tabs-nav a span {
    padding-top: 1px;
    padding-right: 0;
    height: 27px;
    background-position: 0 0;
    line-height: 27px;
}
.ui-tabs-nav .ui-tabs-selected a span {
    padding-top: 0;
    height: 27px;
    line-height: 27px;
}
.ui-tabs-nav .ui-tabs-selected a:link, .ui-tabs-nav .ui-tabs-selected a:visited,
.ui-tabs-nav .ui-tabs-disabled a:link, .ui-tabs-nav .ui-tabs-disabled a:visited { /* @ Opera, use pseudo classes otherwise it confuses cursor... */
    cursor: text;
}
.ui-tabs-nav a:hover, .ui-tabs-nav a:focus, .ui-tabs-nav a:active,
.ui-tabs-nav .ui-tabs-unselect a:hover, .ui-tabs-nav .ui-tabs-unselect a:focus, .ui-tabs-nav .ui-tabs-unselect a:active { /* @ Opera, we need to be explicit again here now... */
    cursor: pointer;
}
.ui-tabs-disabled {
    opacity: .4;
    filter: alpha(opacity=40);
}
.ui-tabs-nav .ui-tabs-disabled a:link, .ui-tabs-nav .ui-tabs-disabled a:visited {
    color: #000;
}
#sidebar .ui-tabs-panel {
    border: 1px solid #67829d;
    padding: 10px;
    background: #f8f5ee; /* declare background color for container to avoid distorted fonts in IE while fading */
}
/*.ui-tabs-loading em {
    padding: 0 0 0 20px;
    background: url(loading.gif) no-repeat 0 50%;
}*/


/* Additional IE specific bug fixes... */
* html .ui-tabs-nav { /* auto clear @ IE 6 & IE 7 Quirks Mode */
    display: inline-block;
}
*:first-child+html .ui-tabs-nav  { /* auto clear @ IE 7 Standards Mode - do not group selectors, otherwise IE 6 will ignore complete rule (because of the unknown + combinator)... */
    display: inline-block;
}

Alles anzeigen

koslowski

Moin,

wo ist der Link zum Problem??

Mr_Wizzy

Kommt gleich als PN, da der Blog noch nicht veröffentlicht ist :razz:

kaiser

Kannst den auch posten und nacher löschen. Da ist die Wahrscheinlichkeit größer, da vermutlich mehr Leute helfen werden.

Mr_Wizzy

Ok ;-)

Hat sich mittlerweile erledigt ;-)
Wäre ich NIEMALS selbst drauf gekommen, von daher vielen herzlichen Dank an Herrn "koslowski"!

Hier die Lösung:

"Die Klasse .post hat ein entsprechendes padding, die Klasse .page jedoch nicht.
Da wo du für die Klasse .post das padding definiert hast (style.css Zeile 323) schreibst du noch die Klasse .page dazu:

Zitat

[COLOR=#007700].[/COLOR][COLOR=#0000bb]post[/COLOR][COLOR=#007700],
.[/COLOR][COLOR=#0000bb]page [/COLOR][COLOR=#007700]{
[/COLOR][COLOR=#0000bb]margin[/COLOR][COLOR=#007700]:[/COLOR][COLOR=#0000bb]0 0 8px[/COLOR][COLOR=#007700];
[/COLOR][COLOR=#0000bb]padding[/COLOR][COLOR=#007700]:[/COLOR][COLOR=#0000bb]12px 8px 12px 30px[/COLOR][COLOR=#007700];
} [/COLOR]

alchymyth

hat sich erledigt - inhalt geloescht wegen schon geloest.

Willkommen! Melden Sie sich an oder registrieren Sie sich.

CSS der Suchfunktion anpassen

Jetzt mitmachen!