Rahmen und zentrieren von Text im Footer

derweber

Guten Abend!
Ich habe meine private Webseite vor ca. 3 Monaten auf WP umgezogen. Zuvor nutzte ich Joomla, wo ich mich mittlerweile gut zurecht finde. Ziel des Umzugs war es ein zweites CMS näher kennen zu lernen.

Webseite: http://www.bettringen.net
WP-Version: 3.8
Theme: Origin 0.5.6 (http://wordpress.org/themes/origin)

Nachdem ich nun die Muse habe ein wenig am Feinschliff zu arbeiten komme ich bei folgenden Problemstellungen nicht weiter:

In der Sidebar rechts habe ich Social-Media Buttons untergebracht. Diese werden, wie auch das Foto auf der statischen Startseite mit einem grauen Rahmen umgeben. Nach Durchsicht des HTML-Quelle werde ich nicht recht schlau daraus, woher dieser Rahmen kommt. .css hänge ich unten an.
Den Schriftzug im Footer hätte ich gerne zentriert. Nach Versuchen mit CSS unter Design -> Themes -> Origin -> Anpassen -> Custom CSS bzw. Design -> Editor komme ich nicht weiter.

Wäre schön, wenn mir jemand auf die Sprünge helfen könnte. Danke schon mal!

style.css des Themes: (Ausschnitte, weil zu lang....)

CSS

body {
    margin: 0;
    font: 0.8125em/1.692307em 'Bitter', Georgia, 'Times New Roman', Times, serif;    /* 13 / 16 = 0.8125;  22 / 13 = 1.692307 */
    color: #555;
    background: #fff;
    padding: 0;
}
::-moz-selection {
    background: #000;
    color: #fff;
    text-shadow: none;
}
::selection {
    background: #000;
    color: #fff;
    text-shadow: none;
}
a, a:visited {
    color: #dd5424;
    text-decoration: none;
}
a:hover {
    text-decoration: none;
    color: #000;
}
a:focus { outline: none; }
a:hover, a:active { outline: 0; }
abbr { cursor: help }
abbr[title] { border-bottom: 1px dotted; }
acronym {
    font-size: .85em;
    text-transform: uppercase;
    color: #666;
    border-bottom: 1px dotted #eee;
    cursor: help;
}
acronym:hover {
    color: #333;
    background: #f5f5f5;
    border-bottom: 1px dotted #aaa;
}
small { font-size: 0.8461538461538462em; }    /* 11 / 13 = 0.8461538461538462 */
big { font-size: 15px; }
p { margin: 0 0 1.692307em 0 }
b, strong { font-weight: bold; }
blockquote {
    margin: 0 1.692307em;
    font-style: normal
}
blockquote em, blockquote cite { font-style: italic }
blockquote, q { quotes: none }
blockquote:before, blockquote:after, q:before, q:after {
    content: '';
    content: none
}
em, cite {
    font-style: italic;
    font-family: Georgia, 'Times New Roman', Times, serif;
}
em em, cite cite { font-style: normal }
dfn { font-style: italic; }
address {
    font-style: italic;
    font-family: Georgia, 'Times New Roman', Times, serif;
    margin: 0 0 1.692307em 0
}
li address, dd address { margin:0 }
del { text-decoration: line-through }
object { margin-bottom: 1.692307em }
hr {
    display: block;
    height: 1px;
    border: 0;
    border-top: 1px solid #e7e7e7;
    margin: 1em 0 1.692307em 0;
    padding: 0;
}
ins {
    font-family: Georgia, 'Times New Roman', Times, serif;
    background: #f5f5f5;
    color: #000;
    text-decoration: none;
    font-style: italic;
}
mark {
    background: #f5f5f5;
    color: #000;
    font-style: italic;
    font-weight: bold;
}
pre, code, kbd, samp {
    font-family: monospace, monospace;
    _font-family: 'courier new', monospace;
    font-size: 1em;
}
pre code { font-size: 1em }
pre {
    font-size: 0.8461538461538462em;
    font-family: Monaco, monospace, Courier, "Courier New";
    overflow: auto;
    line-height: 1.692307em;
    margin-bottom: 1.692307em;
    padding: 10px;
    white-space: pre;
    white-space: pre-wrap;
    word-wrap: break-word;
}
code {
    font-size: 0.8461538461538462em;
    font-family: Monaco, monospace, Courier, "Courier New";
}
sub, sup {
    font-size: 0.7692307692307692em;    /* 10 / 13 = 0.7692307692307692 */
    line-height: 0;
    position: relative;
    vertical-align: baseline;
}
sup { top: -0.5em; }
sub { bottom: -0.25em; }
ul {
    list-style: disc;
    margin: 0 0 1.692307em 2.8em;
    padding: 0;
}
ol {
    list-style-type: decimal;
    margin: 0 0 1.692307em 3.1em;
    padding: 0;
}
ol ol { list-style: upper-roman }
ol ol ol { list-style: lower-roman }
ol ol ol ol { list-style: upper-alpha }
ol ol ol ol ol { list-style: lower-alpha }
ul ul, ol ol, ul ol, ol ul { margin-bottom:0 }
dl { margin: 0 0 1.692307em 5px }
dt {
    font-weight: bold;
    margin: 10px 0 0 0
}
dd { margin: 5px 0 0 1.5em }
h1, h2, h3, h4, h5, h6 {
    font-style: normal;
    font-weight: normal;
    margin: 0 0 15px 0;
    color: #333;
    line-height: 1.3em;
}
h1 { font-size: 2.769230769230769em; }        /* 36 / 13 = 2.769230769230769 */
h2 { font-size: 1.846153846153846em; }        /* 24 / 13 = 1.846153846153846 */    
h3 { font-size: 1.538461538461538em; }        /* 20 / 13 = 1.538461538461538 */
h4 { font-size: 1.384615384615385em; }        /* 18 / 13 = 1.384615384615385 */
h5 {
    font-size: 1.230769230769231em;        /* 16 / 13 = 1.230769230769231 */
    font-weight: bold;
}
h6 {
    font-size: 1.076923076923077em;        /* 14 / 13 = 1.076923076923077 */
    font-weight: bold;
}
img {
    border: 0;
    -ms-interpolation-mode: bicubic;
    vertical-align: middle;
}
svg:not(:root) { overflow: hidden; }
form { margin: 0; }
fieldset {
    border: 0;
    margin: 0;
    padding: 0;
}
label { cursor: pointer; }
legend {
    border: 0;
    *margin-left: -7px;
    padding: 0;
}
button, input, select, textarea, a.button {
    font-size: 1em;
    margin: 0;
    vertical-align: baseline;
    *vertical-align: middle;
}
button, input, a.button {
    line-height: normal;
    *overflow: visible;
}
table button, table input { *overflow: auto; }
button, input[type="button"], input[type="reset"], input[type="submit"] {
    cursor: pointer;
    -webkit-appearance: button;
}
input[type="checkbox"], input[type="radio"] { box-sizing: border-box; }
input[type="search"] {
    -webkit-appearance: textfield;
    -moz-box-sizing: content-box;
    -webkit-box-sizing: content-box;
    box-sizing: content-box;
}
input[type="search"]::-webkit-search-decoration { -webkit-appearance: none; }
button::-moz-focus-inner, input::-moz-focus-inner {
    border: 0;
    padding: 0;
}
textarea {
    overflow: auto;
    vertical-align: top;
    resize: vertical;
}
input:invalid, textarea:invalid { background-color: #f0dddd; }
option { padding: 1px 2px; }
table {
    border-collapse: collapse;
    border-spacing: 0;
    margin-bottom: 1.692307em;
}
td { vertical-align: top; }
th, td { text-align: left; }




/* WordPress classes 
-------------------------------------------------------------- */
.hfeed h1, .hfeed h2, .hfeed h3, .hfeed h4, .hfeed h5, .hfeed h6 { font-weight: normal; }
img.wp-smiley {
    max-height: 0.8125em;
    margin: 0;
    padding: 0;
    border: none;
}
.gallery {
    display: block;
    text-align: center;
    margin-bottom: 1.692307em !important;
}
.left, .alignleft {
    float: left;
    margin: 0 15px 5px 0;
}
.right, .alignright {
    float: right;
    margin: 0 0 10px 25px;
}
.center, .aligncenter {
    display: block;
    margin: 0 auto 1.692307em auto !important;
}
.block, .alignnone {
    display: block;
    margin: 0 0 1.692307em 0;
}
img.alignleft, img.alignright {
    margin-top: 5px;
    display: inline;
}
blockquote.alignleft, blockquote .alignright { width: 33%; }
.byline abbr, .entry-meta abbr, .comment-meta abbr { border: none; }
.clear { clear: both; }




/* Tables 
-------------------------------------------------------------- */
table {
    margin: 0 0 1.692307em 0;
    width: 100%;
}
table caption {
    font-size: 0.8125em;
    line-height: 1.692307em;
    color: #888;
}
table th {
    font-size: 0.8461538461538462em;
    line-height: 1.692307em;
    font-weight: normal;
    text-transform: uppercase;
    padding: 10px 2%;
    border-bottom: none;
    border-bottom: 3px solid #e7e7e7;
    text-align: left;
}
td {
    padding: 0.8125em 2%;
    color: #888;
    border-bottom: 1px solid #e7e7e7;
}


/* Layout
-------------------------------------------------------------- */
#main {
    clear: both;
    width: 100%;
    margin: 0 auto;
    position: relative;
}
.page-template-fullwidth #content { width: 100%; }
#content {
    float: left;
    width: 68.08510638297872%;
    margin: 0 0 30px 0;
    min-height: 180px;
}
#sidebar-primary {
    float: right;
    width: 27.65957446808511%;
}
.wrap {
    max-width: 940px;
    margin: 0 auto;
    position: relative;
}
#comments-template { clear: left; }
#sidebar-subsidiary {
    overflow: visible;
    width: 100%;
    margin: 30px auto 0 auto;
    padding: 30px 0 0 0;
    border-top: 5px solid #444;
    clear: both;
}
#footer {
    overflow: hidden;
    clear: both;
    width: 100%;
    margin: 0 auto;
    padding: 26px 0 30px 0;
    border-top: 5px solid #444;
    font-size: 0.8461538461538462em;
    color: #aaa;
}




/* Footer 
-------------------------------------------------------------- */
#footer p { margin-bottom: 0; }
#footer a { color: #888; }
#footer a:hover { color: #dd5424; }

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

gericoach

such mal nach ".hentry img, .entry-content img, .widget img" in http://www.bettringen.net/wp-content/the…n/style.min.css

zu2. such mal in der Datei oben nach "copyright" und setze dort ein:
text-align: center !important;

derweber

Zitat von gericoach

such mal nach ".hentry img, .entry-content img, .widget img" in http://www.bettringen.net/wp-content/the…n/style.min.css
zu2. such mal in der Datei oben nach "copyright" und setze dort ein:
text-align: center !important;

Hallo & Dankeschön,
die Klasse copyright ist im CSS gar nicht definiert gewesen. Habe es eben extra nochmal in einen Editor kopiert und dort gesucht.

Habe dann versucht die Klasse als zentriert zu definieren.

Code

.copyright { text-align: center; }

und auch

CSS

.copyright { text-align: center !important; }

führen zu keinem anderen Aussehen. Was soll das "!important" überhaupt bedeuten? Ist mir bisher fremd.

Gruß, derweber

Nevery

Also wenn ich folgende Zeilen zu Deinem Style hinzufüge:
.widget img {border:none !important;}
.copyright {text-align:center;}
lösen sich beide Deiner Probleme. Du hast allerdings im Moment auch keinen Stil für .copyright definiert.

!important bedeutet soviel wie "ich meine das ernst, nimm wirklich DIESE Angabe!" - zeitweise beim überschreiben von Angaben notwendig ;)

derweber

Zitat von Nevery

Also wenn ich folgende Zeilen zu Deinem Style hinzufüge:
.widget img {border:none !important;}
.copyright {text-align:center;}
lösen sich beide Deiner Probleme. Du hast allerdings im Moment auch keinen Stil für .copyright definiert.
!important bedeutet soviel wie "ich meine das ernst, nimm wirklich DIESE Angabe!" - zeitweise beim überschreiben von Angaben notwendig ;)

Dankeschön!
Ich habe beides im .css eingebaut. Darfst dich gerne selbst davon überzeugen, ich lass es mal drin stehen. Erfolg: keiner. Weil ich an mir gezweifelt habe, habe ich es eben noch mit diversen Browsern versucht, um auszuschließen, dass dort der Fehler liegt. Firefox, Chrome, Safari, IE: überall kein Resultat...

Klassen definiert im CSS:

CSS

/* WordPress classes -------------------------------------------------------------- */
.hfeed h1, .hfeed h2, .hfeed h3, .hfeed h4, .hfeed h5, .hfeed h6 { font-weight: normal; }
img.wp-smiley {
	max-height: 0.8125em;
	margin: 0;
	padding: 0;
	border: none;
}
.gallery {
	display: block;
	text-align: center;
	margin-bottom: 1.692307em !important;
}
.left, .alignleft {
	float: left;
	margin: 0 15px 5px 0;
}
.right, .alignright {
	float: right;
	margin: 0 0 10px 25px;
}
.center, .aligncenter {
	display: block;
	margin: 0 auto 1.692307em auto !important;
}
.block, .alignnone {
	display: block;
	margin: 0 0 1.692307em 0;
}
img.alignleft, img.alignright {
	margin-top: 5px;
	display: inline;
}
blockquote.alignleft, blockquote .alignright { width: 33%; }
.byline abbr, .entry-meta abbr, .comment-meta abbr { border: none; }
.clear { clear: both; }




.widget img {border:none !important;}




.copyright {text-align:center;}

Alles anzeigen

Nevery

Es kann auch kein Resultat geben, weil es nirgens definiert ist...
Ich muss jetzt mal ganz dumm fragen: Du bist Dir SICHER, dass Du 1. die richtige CSS-Datei geändert hast, 2. diese auch wieder hochgeladen hast und 3. es beim überschreiben keine Fehler gab? Fakt ist, dass die Angaben nicht in den eingebundenen CSS-Dateien stehen.

Nevery

Überprüf bitte mal im Quelltext Deiner Seite, ob die von Dir geänderte CSS-Datei eingebunden ist - ich sehe keine, in der die von Dir hier zitierten Angaben stehen.

derweber

Zitat von Nevery

Es kann auch kein Resultat geben, weil es nirgens definiert ist...
Ich muss jetzt mal ganz dumm fragen: Du bist Dir SICHER, dass Du 1. die richtige CSS-Datei geändert hast, 2. diese auch wieder hochgeladen hast und 3. es beim überschreiben keine Fehler gab? Fakt ist, dass die Angaben nicht in den eingebundenen CSS-Dateien stehen.

Hallo,
ich habe die Datei style.css des Themes Origin direkt im Browser bearbeitet. Ich bin mir sicher im richtigen Theme zu arbeiten. Dort ist es abgespeichert und steht auch immer noch drin.

http://www.bettringen.net/wp-content/themes/origin/style.css

Gruß,
Markus

Nevery

Die richtige style.css - das glaube ich Dir. Nur leider ist die Datei in Deinem Theme nicht eingebunden *g*
Geh mal in den Theme-Ordner und schau Dir die (vermutlich) header.php an, dort müsstest Du die Datei noch einbinden. Vermutlich funktioniert das mit dieser Zeile:
<link rel='stylesheet' href='<?php echo bloginfo( 'stylesheet_url' );?>' type='text/css' media='all' />

gericoach

[FONT=arial]das war der Grund, weshalb ich auf die [/FONT][FONT=arial]"style.min.css?ver=0.5.6" hingewiesen hatte.[/FONT]

derweber

Danke,
das ist sehr interessant. *grmpf* Habe es eben mit deinem php-Code versucht, der wirft dann folgendes aus:

[FONT=monospace]<link rel='stylesheet' href='http://www.bettringen.net/wp-content/the…n/style.min.css' type='text/css' media='all' />

Wie bekomme ich statt style.min.css die style.css da rein? Oder soll ich einfach harten Code da reinschreiben, also:

derweber

Habe es jetzt in der style.min.css geändert. Sieht gut aus. Danke euch beiden!

Willkommen! Melden Sie sich an oder registrieren Sie sich.

Rahmen und zentrieren von Text im Footer

Jetzt mitmachen!

Benutzer online in diesem Thema