zurück zur Startseite
  


Zurück XHTMLforum > (X)HTML und CSS > CSS
Seite neu laden Hintergrundbild rechts außerhalb ausrichten

Antwort
 
LinkBack Themen-Optionen Ansicht
  #1 (permalink)  
Alt 05.04.2004, 12:05
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 09.03.2004
Beiträge: 16
motzi befindet sich auf einem aufstrebenden Ast
Standard Hintergrundbild rechts außerhalb ausrichten

Hallo Forum!
Ich habe folgendes Problem: Ich habe mir per CSS eine class eingerichtet, die um den selektierten Text eine blaue Kontur zieht und eine weiße Fläche hinterlegt. Soweit, sogut. Jetzt möchte ich ein Bild rechts außerhalb an den Kasten anhängen, doch leider setzt er mir das Bild immer rechts in den Kasten unter den Text und schließt rechts damit ab. Hier das css:

.infoblatt { color: #039; font-weight: bolder; font-size: 8pt; line-height: 8pt; font-family: Verdana; text-decoration: none; background: #fff url(rahmen/pfeil_rechts.gif) no-repeat right center; text-align: left; float: left; padding-right: auto; border-top: 1px solid #039; border-right: none #039; border-bottom: 1px solid #039; border-left: 1px solid #039; clip: rect(auto auto auto auto); display: block }

Da ist bestimmt 'ne Menge Müll mit drin, aber vielleicht kann ja jemand aufräumen und mir weiterhelfen?? Vielen Dank!

MOTZI
Mit Zitat antworten
Sponsored Links
  #2 (permalink)  
Alt 05.04.2004, 12:29
Benutzerbild von hemfrie
Administrator
XHTMLforum-Kenner
 
Registriert seit: 18.12.2003
Ort: Düsseldorf
Beiträge: 2.775
hemfrie ist jedem bekannthemfrie ist jedem bekannthemfrie ist jedem bekannthemfrie ist jedem bekannthemfrie ist jedem bekannthemfrie ist jedem bekannt
Standard

also bei mir wird das Bild rechts neben den Kasten gesetzt

Code:
	.infoblatt {
		background: url(rahmen/pfeil_rechts.gif) #FFFFFF no-repeat right center;
		border-bottom: 1px solid #003399;
		border-left: 1px solid #003399;
		border-right: none #003399;
		border-top: 1px solid #003399;
		color: #003399;
		float: left;
		font: bolder 8pt/8pt Verdana, Geneva, Arial, Helvetica, sans-serif;
		text-align: left;
	}

Code:
<div class="infoblatt">bla bla bal 
 bla bal bal 
 bla bla bla</div>
[img]bild.gif[/img]
Vielleicht hast Du das Image ja in das Div mit reingepackt?


hemfrie
Mit Zitat antworten
Sponsored Links
  #3 (permalink)  
Alt 05.04.2004, 12:53
Erfahrener Benutzer
XHTMLforum-Kenner
 
Registriert seit: 25.03.2004
Beiträge: 1.843
RoToRa wird schon bald berühmt werden
Standard

Ehrlich gesagt ist in der Regel wirklich viel Müll drin. Und ich bin nicht ganz sicher, ob ich ganz verstanden habe was Du willst.

Aber erstmal zur den Problemen bei der Regel. Auch hier Ich bin nicht ganz sicher was Du mit einigen Angaben willst, da Sie außerhalb eines Kontextes augenscheinlich sinnlos und wahllos - oder vielleicht von einem "WYSIWYG"-Editor - eingefügt wurden wurden.
  • font-weight: bolder; Ein einfaches font-weight]
  • font-size: 8pt; ist sehr böse. Punkte (pt) bringen nur was in einem Druck-Stylesheet. Wenn überhaupt Pixel (px), oder noch besser relative Angaben. Wenn infosheet nicht gerade unwichtige Rechs- oder Copyright-Texte enthalt wäre font-size]
  • [b]line-height]
  • [b]text-decoration]
  • [b]text-align]
  • [b]padding-right]
  • [b]clip]
  • [b]display]
  • border: 1px solid #039; border-right: none #039; border-bottom: 1px solid #039; border-left: 1px solid #039; Kann man mit border. 1px solid #039; border-right]

So nun zu deinem eigentlich Problem: Ohne einem zusätzllichen DIV (oder anderem Element) wird das so wie ich denke du es willst, nichts. Im HTML folgendes benutzen:

Code:
<div class="infosheet"><div>Text Text Text</div></div>
Und im Stylesheet:

Code:
.infoblatt { 
	font-family: Verdana; 
	font-weight: bold; 

	color: #039; 
	background: #fff url(rahmen/pfeil_rechts.gif) no-repeat right center; 

	float: left; 
} 

.infoblatt div {
	border: 1px solid #039; border-right: none;
	margin-right: 100px; /* Hier einen Wert verwenden, der so groß oder etwas größer ist als die Größe des Hintergrundbildes */
}
Mit Zitat antworten
  #4 (permalink)  
Alt 05.04.2004, 13:03
Benutzerbild von hemfrie
Administrator
XHTMLforum-Kenner
 
Registriert seit: 18.12.2003
Ort: Düsseldorf
Beiträge: 2.775
hemfrie ist jedem bekannthemfrie ist jedem bekannthemfrie ist jedem bekannthemfrie ist jedem bekannthemfrie ist jedem bekannthemfrie ist jedem bekannt
Standard

ich glaube, da hab ich jetzt auch was falsch verstanden. *g*

Willst Du das Bild als background-image anhängen?


hemfrie
Mit Zitat antworten
  #5 (permalink)  
Alt 05.04.2004, 14:18
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 09.03.2004
Beiträge: 16
motzi befindet sich auf einem aufstrebenden Ast
Standard

Hallo und vielen Dank für die schnelle Antwort.
Also die Lösung von rotora klappt am pc im ie 5, 5.5 und in netscape 7 gut, aber am Mac im ie 5 wird das äußere div (der Kasten) sehr breit gezogen, läuft also viel breiter, als der Text, der im Kasten steht. Ich weiß nicht, ob man das ändern kann, aber wenn nicht, bin ich auch so schon sehr glücklich. Vielen Dank erstmal!
Mit Zitat antworten
  #6 (permalink)  
Alt 05.04.2004, 18:44
Erfahrener Benutzer
XHTMLforum-Kenner
 
Registriert seit: 25.03.2004
Beiträge: 1.843
RoToRa wird schon bald berühmt werden
Standard

Zitat:
Zitat von motzi
Also die Lösung von rotora klappt am pc im ie 5, 5.5 und in netscape 7 gut, aber am Mac im ie 5 wird das äußere div (der Kasten) sehr breit gezogen, läuft also viel breiter, als der Text, der im Kasten steht.
Wiedermal bin ich nicht ganz sicher was Du meinst. DIVs ohne angegebene Breite sind grundsätzlich so breit wie möglich. Ich wüsste nicht was der MacIE da anders machen sollte und ich habe auch kein Mac zum Testen da. Du könntest dem infosheet eine konkrete Breite geben, z.B. in 90%. (Beachte jedoch nicht 100% zu verwenden, dann wird es in nicht kaputen Browsern zu breit, da die Border-Breite noch dazu kommt.
Mit Zitat antworten
Antwort

Themen-Optionen
Ansicht

Forumregeln
Es ist Ihnen nicht erlaubt, neue Themen zu verfassen.
Es ist Ihnen nicht erlaubt, auf Beiträge zu antworten.
Es ist Ihnen nicht erlaubt, Anhänge hochzuladen.
Es ist Ihnen nicht erlaubt, Ihre Beiträge zu bearbeiten.

BB-Code ist an.
Smileys sind an.
[IMG] Code ist an.
HTML-Code ist aus.
Trackbacks are an
Pingbacks are an
Refbacks are aus


Ähnliche Themen
Thema Autor Forum Antworten Letzter Beitrag
Bild im Fliesstext unten rechts ausrichten FinalAngel CSS 3 08.01.2009 09:29
div mit border - Text links ausrichten , Img rechts ausrichten Camelrider CSS 1 10.12.2007 18:31
Hintergrundbild rechts ausrichten - Opera, Netscape opa-rudi CSS 2 12.06.2007 21:22
Grafik in einer Tabellenzelle rechts unten ausrichten ? Worance CSS 1 19.11.2006 16:09
Tabelle rechts ausrichten mit CSS Simon_B CSS 6 23.08.2005 17:04


Alle Zeitangaben in WEZ +2. Es ist jetzt 05:39 Uhr.