a so hoch wie b - nur wie?

Hallo,

erst mal, ich bin neu :slight_smile:

und dann habe ich auch schon ein Problem. Mein größtes Problem ist wohl, dass ich versuche ein Wordpress-Theme zu erstellen und in Wirklichkeit kaum Ahnung habe von CSS, HTML & Co :wink:

Na, wie auch immer, ich hoffe ihr könnt mir trotzdem weiter helfen.

Ich habe folgenden Header:

[HTML]

<?php bloginfo('name'); ?> <?php wp_head(); ?>
Logo <?php bloginfo('name'); ?> <?php if (!function_exists('dynamic_sidebar') || dynamic_sidebar('Menu') ) : ?> <?php endif; ?>
Banner
[/HTML]

und dazu gehörige CSS sieht so aus:

[CODE]#header-bar {
background: #f7a786;
position: absolute;
left: 0;
width: 100%;
height: 12%;
top: auto;
}

#page {
position: relative;
width: 90%;
height: auto;
margin: 0 auto;
}

header {
background: #f7a786;
color: #FFFFFF;
width: 100%;
}

header img {
margin: 13px 20px 0 20px;
float: left;
width: auto;
height: 100%;
}

header span {
float: left;
line-height: 5.5em;
font-size: 1.35em;
text-transform: uppercase;
letter-spacing: 2px;
}

header ul {
float: right;
top: auto;
line-height: 5.5em;
margin: 0 20px 0 0;
}
[/CODE]

jetzt möchte ich aber, dass die header-bar die ganze Seitenbreite einnimmt, während der header nur so breit ist, wie die page. Das glaub ich hab ich hingekriegt. So jetzt soll aber auch noch beides gleich hoch sein. Wenn ich für beides die selbe %-Zahl eingebe funktioniert das schon mal nicht. Mit (z.B.) 100px funktioniert es einwandfrei! (line-height in den entsprechenden Zeilen ebenfalls auf 100px gesetzt). Da ich aber gerade an der responsiveness arbeite, „muss“ ich ja alles in % angeben. (Hab ich das so richtig verstanden?)

Wäre sehr nett, wenn ihr mir helfen könntet und das in für einen Noob verständliche Worte fassen könntet!

Danke schon mal!

LG
die_biny

Hallo

in Wirklichkeit kaum Ahnung habe von CSS, HTML & Co

Das interessiert die Browser kein bißchen.

dass ich versuche ein Wordpress-Theme zu erstellen

Ohne gutes Grundwissen sehe ich da erhebliche Schwierigkeiten. Wir werden dir zu einzelnen Problemen gerne helfen, aber wenn es im Endeffekt darauf hinausläuft, dir eine persönliche Einführung in HTML / CSS und Wordpress zu geben werden wir schlicht zeitmäßg überfordert sein.

das in für einen Noob verständliche Worte fassen könntet

Das ist schwierig. Erst mal wissen wir nicht wie weit dein Kenntnisstand ist. Zum zweiten gibt es Begriffe, deren Kenntnis wir einfach voraussetzen müssen. Ansonsten würde die Hilfe auf einen kompletten Anfängerkurs mit entsprechend viel Text hinauslaufen. Dafür habe ich zumindest keine Zeit. Zum dritten sehe zumindest ich nicht, warum ich komplette Lösungen schreiben soll, die bereits mehrfach im Internt veröffentlicht wurden. Dann sollte auch ein Hinweis auf solche Lösungen reichen.

Ein Quellcode mit PHP-Elementen nützt leider nichts, da wir nicht mal ansatzweise raten können, was sich hinter den PHP-Anweisungen verbirgt.

Da ich aber gerade an der responsiveness arbeite, „muss“ ich ja alles in % angeben. (Hab ich das so richtig verstanden?)

Nein. Nur dort wo es sinnvoll ist. Die Höhen sollen die Browser in der Regel selbst bestimmen. Da Webseiten zudem keine Höhe haben sind Höhenangaben in % in der Regel problembehaftet.

An anderen Stellen können fixe Angaben durchaus sinnvoll sein.

So jetzt soll aber auch noch beides gleich hoch sein.

Ein altes Problem. Du suchst „Faux column“ oder als aktuellere Lösung Flexbox. Wobei ich Flexbox bevorzuge, das aktuell und zukunftsträchtig ist. „Faux column“ ist eher ein optischer Trick.

Gruss

MrMurphy

Na ein bisschen Ahnung hab ich schon, sonst hätte ich den code oben ja nicht hingekriegt :wink: 100-seitige Antworten sind auch nicht notwendig und am Patschehändchen muss mich auch keiner nehmen.

Kurzes Fazit deiner Antwort: ich darf hier ruhig mit px arbeiten, hab ich das richtig verstanden? Das wäre ja super, dachte ich muss bei responsive alles in % oder em angeben -.- bis auf eine Referenzgröße.

Hallo

ich darf hier ruhig mit px arbeiten, hab ich das richtig verstanden

Was heißt „hier“? Wenn du so fragst: Nein.

Ich habe geschrieben

Nur dort wo es sinnvoll ist. Die Höhen sollen die Browser in der Regel selbst bestimmen.

Gruss

MrMurphy

Um das Stylesheet zu holen kannst du einfach

[PHP]get_stylesheet_uri()[/PHP]

nutzen. Seit WordPress 4.1 soll das title-Element per

[PHP]add_theme_support( ‚title-tag‘ );[/PHP]

eingebunden werden (in der functions.php) und nicht in die header.php geschrieben werden.