Ausrichtung von zwei Bildern im head-Bereich

manninds · #1 (**permalink**) 08.07.2010, 13:43

Hallo,

ich bin ein Neuling in Sachen CSS, habe schon diverse Beiträge zu meinem Problem gelesen, bekomme eine Lösung aber einfach nicht hin.

Ich möchte in einem Header zwei Bilder anzeigen lassen. Das eine soll am linken Rand stehen, das andere am rechten Rand.

Für den header habe ich diesen Code genutzt:

Code:

#header {background:url(img/logo_internet_81.gif) no-repeat; position:absolut:; left:10px; top:10px; width:273px; height:81px; #fff; color:#505050; margin:10 10 10 10px; padding:0;}

Damit wird das Bild im header auch korrekt angzeigt.

Nun will ich in der gleichen Höhe auf der rechten Seite des Headers auch noch ein Bild anzeigen lassen.

Das geht aber irgendwie nicht. Die Bilder versetzen sich oder das eine überlagert das andere. Nun hatte ich gedacht, baue ich mir einen zweiten header-Bereich und richte dort das Bild rechts aus. Dazu hatte ich diesen Code genutzt:

Code:

#rightlogo {background:url (img/hinweis_mini.gif) no-repeat; position:absolute; left:749px; top:18px; width:374px; height:48px;}

Das haut aber leider alles nicht hin. Ehrlich gesagt, bin ich mir auch völlig unsicher, ob das überhaupt geht.

Kann mir hier jemand vielleicht erklären, welchen Code ich in einem CSS-Script verwenden muss, damit ich zwei Bilder in derselben Höhe, einmal am linken Rand und einmal am rechten Rand ausrichten kann? Das muss doch gehen.

Wäre für ein Beispiel dankbar.

Schon mal vielen Dank!
Manni

InfoJunkie · #2 (**permalink**) 08.07.2010, 13:46

hey,
versuch mal zu floaten.

linke div float:left;
rechte div float:right;

gruß

manninds · #3 (**permalink**) 08.07.2010, 13:54

Wo und wie genau trage ich denn float ein?

InfoJunkie · #4 (**permalink**) 08.07.2010, 13:57

so kann man zwei oder mehr IDS nebeneinander positionieren und diese quasi als spalten benutzen.

#links
{
float: left;
height: xx;
width: xx;
}

#rechts
{
float:right;
heght: xx;
width: xx;
}

gruß

manninds · #5 (**permalink**) 08.07.2010, 14:12

Sorry, aber ich fische hier wirklich im Trüben. Hast du meinen Code in meiner Frage gesehen? Wie nutze ich jetzt zusätzlich dieses float-element. Weiß nicht, was ich schreiben soll.

InfoJunkie · #6 (**permalink**) 08.07.2010, 14:24

Code:

#header
{
background:url(img/logo_internet_81.gif) no-repeat;
position:absolut:;<--?
left:10px;
top:10px;
width:273px;
height:81px;
#fff; <-- he?
color:#505050;
margin:10 10 10 10px;
padding:0;
}

Code:

#rightlogo 
{
background:url (img/hinweis_mini.gif) no-repeat;
position:absolute;
left:749px;
top:18px;
width:374px;
height:48px;
}

das sind deine codes ...
probier jetzt mal "float:left;" und "float:right;" einzubringen.
liegen die beiden divs in einem anderen drinne?

(ich bin auch noch komplett neu in der materie, also verlass dich nicht auf mich

)

Themen-Optionen
Druckbare Version zeigen Jemanden per E-Mail auf dieses Thema hinweisen
Ansicht
Linear-Darstellung Zur Hybrid-Darstellung wechseln Zur Baum-Darstellung wechseln

Ähnliche Themen
Thema	Autor	Forum	Antworten	Letzter Beitrag
2 icons im head bereich	hi_all	CSS	0	22.07.2010 10:35
Verweise im Body Bereich erstellen (HTML, Javascript)	Punto1976	Javascript & Ajax	3	01.05.2010 14:08
unterschiedliche Ausrichtung von Bildern	LordAvalon	CSS	6	07.09.2007 17:10
Head Bereich + Berechnung	\|SONY\|	CSS	1	29.04.2006 18:33
Head Bereich mit 3 Elementen	Friedel	CSS	10	01.11.2005 07:49