Um schreiben oder kommentieren zu können, benötigen Sie ein Benutzerkonto.
Sie haben schon ein Benutzerkonto? Melden Sie sich hier an.
Jetzt anmeldenHier können Sie ein neues Benutzerkonto erstellen.
Neues Benutzerkonto erstellen
Hallo zusammen,
ich möchte auf folgender Website http://www.steuerger%c3%a4t-rep24.de folgendes erreichen:
Auf der Rechten Seite sollen die Auto logos angezeigt werden.
Sprich ergebnis soll so ausehen:
Leider Weiß ich nicht, wo ich den html code für das Bild einfügen soll:
<img src="http://www.steuergeraet-rep24.de/wordpress/wp-c…14/01/logos.bmp">
Nutze übrigens das Twentyeleven Template
Danke im VOraus!
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.
Du müsstest div id="page" floaten lassen und am Ende von Page das Bild in einem neuen Div einfügen und ebenfalls floaten lassen, könnte ich mir vorstellen. Page halt float:left und Div mit Bild halt right.
<body class="home blog custom-background single-author two-column left-sidebar">
<div id="page" class="hfeed">
...
...
</div><!-- #page -->
<div id="neu">Ein Bild</div>
...
</body>
</html>CSS float: http://www.css4you.de/float.html
Hello,
ich verstehe nicht wie du das meinst. Ich hab in der Seite eingefügt:
<img src="http://www.steuergeraet-rep24.de/wordpress/wp-c…14/01/logos.bmp" style="float:right;">Jetzt, wird das Bild rechts angezeigt, aber nicht in der position, in der Ich das haben möchte.
Nicht das Image float:right, den neu zu erstellenden DIV-Bereich, in dem das Image eingefügt wird.
Wo kann ich das div id="page" floaten lassen ????
In der style.css. Könnte jedoch sein, dass das Theme insgesamt angepasst werden muss, wird wohl auch so sein und da es ein responsives Design ist, könnten diese Anpassungen umfangreich werden. Zeitlich gesehen wirst Du das nicht mit ein paar kleinen Änderungen innerhalb weniger Stunden bewerkstelligen.
Du könntest Dir dafür eine Testseite erstellen, wo Du dann Schritt für Schritt die Änderungen vornehmen könntest. Hier habe ich Styles nun im Head untergebracht, bei WP gehören diese in die style.css, wobei ja eigentlich nur Styles für den neuen Div-Bereich fehlen, alles andere ist ja vorhanden und muss nur neu angepasst werden.
<!DOCTYPE html>
<html>
<head>
<title>Nur eine Testseite</title>
<style type="text/css">
.hfeed {float:left}
.fneu {float:right; margin-right:100px}
</style>
</head>
<body>
<div id="page" class="hfeed">
<header id="branding" role="banner">
<h1>Titel und mehr</h1>
...
</header><!-- #branding -->
<div id="main">
<div id="primary">
<div id="content" role="main">
<p>Content und mehr ... Content und mehr ...</p>
...
</div><!-- #content -->
</div><!-- #primary -->
</div><!-- #main -->
<footer id="colophon" role="contentinfo">
...
</footer><!-- #colophon -->
</div><!-- #page -->
<div id="neu" class="fneu">Ein Bild</div>
...
</body>
</html>Aber selbstverständlich klappt das, habe ja die Datei so wie sie ist im Browser aufgerufen und 'Ein Bild' wird rechtseitig ausgegeben. Wenn Du Dir nicht sicher bist, dann gebe beiden DIVs vorübergehend einen Border, dann siehst Du ja, was die machen.
Background-image lässt sich mit background-repeat steuern, in diesem Fall mit background-repeat:no-repeat und der Abstand lässt sich ebenfalls angeben. Wäre eine Lösung, nur wie willst Du den Abstand steuern bei einem responsiven Design?
hab konstanten eingegeben, ich muss jetzt bei freunden sehen wie es bei jeden so aussieht....
Wenn Screen etwas kleiner, so verschiebt sich Image nach außen, wenn Screen etwas größer, schiebt sich Image hinter die Page. Du kannst das teilweise bereits kontrollieren, in dem Du das Fenster vom Browser schrittweise verkleinerst oder vergrößerst. Wenn der Abstand zu klein oder zu groß wird, kannst Du das mit Media Queries zuerst korrigieren und wenn der Platz nicht mehr ausreicht ausblenden.
Ist wohl die einfachere Lösung mit Background-Image, nur eben wegen diesen Verschiebungen hätte ich das lieber wie ein mehrspaltiges Layout versucht zu lösen, wo der Abstand des schmaleren DIVs zur Page zum Beispiel mit 20px angegeben werden könnte und gleichbleibend wäre. Dabei dann mit Media Queries versucht zu arbeiten um das erst aber einer gewissen Fenstergröße ein- und auszublenden. Ist jetzt nur ein Beispiel:
@media (max-width:999px) {
div.fneu {float:left; width:0px; overflow:hidden; display:none}
}
@media (min-width:1000px) {
div.fneu {float:left; width:100px; margin-left:20px}
}Sie haben noch kein Benutzerkonto auf unserer Seite? Registrieren Sie sich kostenlos und nehmen Sie an unserer Community teil!