Site Logo u. Text der Forumsbeschreibung zentrieren?

[Silke1969]

Hallo liebes Forum,

ich hoffe ihr könnt mir bei meinem kleinen Problem weiterhelfen.

phpBB3 v. 3.1.10 - Style: prosilver wie aus der Original Installation

Aktuell befindet sich das Logo wie auch der Text der Forumsbeschreibung links.
Nun würde ich Beides jedoch gerne mittig angezeigt haben wollen.

Leider habe ich dazu bisher noch keine Möglichkeit gefunden diesen frommen Wunsch in die Tat umgesetzt zu bekommen,
und hoffe sehr ihr könnt mir - schön wäre eine möglichst genaue Anleitung - dabei helfen.

Das man in der common.css von - links nach rechts verschieben kann habe ich zwar bereits über die Suche entdecken können
( und auch erstmal nur via Firebug probiert bzw. die Wirkung getestet ), nicht jedoch wie ich Logo und Text zentriert bekomme.

Ein Eindruck wie Logo und Text Derzeit bei meinem Forum angezeigt werden, kann sich hier verschafft werden:
http://www.hamburger-anglerstammtisch.d ... /index.php

Mfg,
Silke

[Kirk]

Hallo
Suche in der common.css das hier:

Code: Alles auswählen

#site-description {
    float: left;
    width: 65%;
}

Änder es so um:

Code: Alles auswählen

#site-description {
    float: left;
    margin-left: 16%;
    text-align: center;
    width: 65%;
}

Ändere den Wert bei margin-left nach deinen Wünschen.

[Silke1969]

Lieber Kirk,
habe deine Anleitung inzwischen Erfolgreich umgesetzt *freu*.
Ich danke dir ganz herzlich für deine tolle Unterstützung bzw. Hilfestellung.

Mfg,
Silke

[Patrick Lakewood]

hi ich häng mich hier gleich mal dran

hab ein wenig kenntnis von css und html, dennoch ist das hier bissl abweichend

habs jetzt ebenso wie im beitrag über mir, nur hätte ich gerne die logobeschreibung darunter

mit clear: both komm ich nicht hin, da das ja inline elemente sind, also wie darf ich da arbeiten?

[Kirk]

Hallo
Da ich nicht weiss wie groß dein Logo ist und du ebenfalls prosilver verwendest, hier eine ungefähre Angabe (basierend auf prosilver).
Öffne: root/styles/prosilver/template/overall_header.html
Finde:

Code: Alles auswählen

			<div id="site-description">
				<a id="logo" class="logo" href="<!-- IF U_SITE_HOME -->{U_SITE_HOME}<!-- ELSE -->{U_INDEX}<!-- ENDIF -->" title="<!-- IF U_SITE_HOME -->{L_SITE_HOME}<!-- ELSE -->{L_INDEX}<!-- ENDIF -->">{SITE_LOGO_IMG}</a>
				<h1>{SITENAME}</h1>
				<p>{SITE_DESCRIPTION}</p>
				<p class="skiplink"><a href="#start_here">{L_SKIP}</a></p>
			</div>

Ersetzen mit:

Code: Alles auswählen

			<div id="site-description">
				<a id="logo" class="logo" href="<!-- IF U_SITE_HOME -->{U_SITE_HOME}<!-- ELSE -->{U_INDEX}<!-- ENDIF -->" title="<!-- IF U_SITE_HOME -->{L_SITE_HOME}<!-- ELSE -->{L_INDEX}<!-- ENDIF -->">{SITE_LOGO_IMG}</a>
			<div id="board-name">
				<h1>{SITENAME}</h1>
				<p>{SITE_DESCRIPTION}</p>
			</div>
				<p class="skiplink"><a href="#start_here">{L_SKIP}</a></p>
				</div>

Öffne: root/styles/prosilver/theme/common.css
Finde:

Code: Alles auswählen

#site-description h1 {
	margin-right: 0;
}

Danach einfügen:

Code: Alles auswählen

#board-name {
    margin-left: 9px;
    margin-top: 70px;
}

Ändere die Werte nach deinen Wünschen.

Öffne: root/styles/prosilver/theme/responsive.css
Finde:

Code: Alles auswählen

#site-description p, .search-header {
	display: none;
}

Danach einfügen:

Code: Alles auswählen

#board-name {
    margin: 0;
}

Zum Schluss den Foren sowie den Browser Cache leeren.

[Patrick Lakewood]

vielen dank für die hilfe, hat aber leider nicht geklappt - hier mal das forum:

http://seewald.bplaced.net/hw-forum/

[Kirk]

Ändere die Werte in dercommon.css bei #board-name { in das um:

Code: Alles auswählen

    float: left;
    margin-right: 73%;
    margin-top: 7px;

in der root/styles/prosilver/theme/responsive.css
trage dort bei #board-name { zusätzlich das hier ein:

Code: Alles auswählen

float: none;

und bei #site-description { zusätzlich das hier eintragen:

Code: Alles auswählen

margin: 0;