| Autor |
Nachricht |
-
muepfe-radio
|
 03.06.2010 um 20:32 (UTC)
Titel: CSS-Fehler bei Positionierung |
|
|
Hi,
bei mir liegt ein Fehler in dieser Klasse/ Id vor:
Ich will die Breite automatisch anpassen lassen.
Dazu habe ich bereits width entfernt, doch dann wird es plötzlich ganz breit angezeigt. 
Leider lässt sich die Breite dann immernoch nicht automatisch an den Text anpassen.
Irgendwie scheint in dieser Anweisung ein Fehler drinnen zu sein:
Code: Text über dem Design:
<div id="Titel2">Willkommen!</div>
Code: CSS ohne Style tags:
#Titel2{
height: 20px;
background: url(http://muepfe-radio.square7.ch/WebQuark/Design/titel2.PNG);
margin: 35px 0px 0px 70px;
padding: 16px 0px 0px 3px;
}
Was mache ich falsch?
Grüße
Andreas
Zuletzt bearbeitet von muepfe-radio am 04.06.2010, 16:13, insgesamt 6-mal bearbeitet
|
|
|
↑
|
|
 |
-
blutsegelbukaniere
|
03.06.2010 um 20:57 (UTC)
Titel: |
|
|
Schon mal die Angabe "width: 100%" versucht? Das sollte eigentlich gehen.  ______________ Spendet jetzt für den User -Name entfernt - , damit er sich ein Duden kaufen kann, da seine Schreibkünste die einens 11-jährigen sehr stark ähneln.  |
|
|
↑
|
|
|
-
muepfe-radio
|
03.06.2010 um 21:02 (UTC)
Titel: |
|
|
Leider funktioniert das auch nicht.
Damit wurde der Hintergrund nur voll ausgeweitet, aber nicht auf den Inhalt beschränkt. 
-> muepfe-radio-beta.de.tl
Der Hintergrund soll eingeltich so lange sein, wie der Inhalt, soll sich also automatisch anpassen.
Grüße
Andreas |
|
|
↑
|
|
|
-
ill-fated
Wohnort: in einem Haus (jetzt sogar mit Dach)
|
03.06.2010 um 21:04 (UTC)
Titel: Breite von div anpassen |
|
|
Hallo
"width: 100%;" verbreitert die Klasse nur auf die maximale Fenstergröße, passt sich aber nicht dem Inhalt an.
Bei mir funktioniert es, wenn ich der Klasse die explizite Positionsart "position: absolute;" zufüge. Komischerweise funktioniert es beim weglassen derselben oder bei "relative" nicht. "position: absolute;" benötigt aber zusätzlich die "top"- und "left"-Angaben:
Zitat:
#Titel2
{
position: absolute;
height: 20px;
top: XXpx;
left: 50%;
margin-left: YYpx;
background-image: url(http://muepfe-radio.square7.ch/WebQuark/Design/titel2.PNG);
margin: 35px 0px 0px 70px;
padding: 16px 0px 0px 3px;
}
Gruß
Zuletzt bearbeitet von ill-fated am 03.06.2010, 22:08, insgesamt einmal bearbeitet
|
|
|
↑
|
|
|
-
muepfe-radio
|
04.06.2010 um 15:16 (UTC)
Titel: |
|
|
Ohje, noch ein kleines Problem entdeckt:
-> http://de333.de.tl/Kontakt.htm
Nach dem sollte eigentlich diese Grafik:
Code: #Titel3 {
width: 36px;
height: 37px;
float: left;
background: url(http://muepfe-radio.square7.ch/WebQuark/Design/Titel3.PNG);
margin: -35px 0px 0px 135px;
}
automatisch nach dem Titel2 kommen.
Doch irgendwie weiß ich bei der automatischen Positionierung nicht weiter.
Grüße
Andreas |
|
|
↑
|
|
|
-
southpark-comedyclub
|
04.06.2010 um 15:39 (UTC)
Titel: Re: CSS-Fehler bei Positionierung |
|
|
muepfe-radio hat Folgendes geschrieben: Hi,
bei mir liegt ein Fehler in dieser Klasse/ Id vor:
Ich will die Breite automatisch anpassen lassen.
Dazu habe ich bereits width entfernt, doch dann wird es plötzlich ganz breit angezeigt.
Leider lässt sich die Breite dann immernoch nicht automatisch an den Text anpassen.
Irgendwie scheint in dieser Anweisung ein Fehler drinnen zu sein:
Code: Text über dem Design:
<div id="Titel2">Willkommen!</div>
Code: CSS ohne Style tags:
#Titel2{
height: 20px;
background: url(http://muepfe-radio.square7.ch/WebQuark/Design/titel2.PNG);
margin: 35px 0px 0px 70px;
padding: 16px 0px 0px 3px;
}
Was mache ich falsch?
Grüße
Andreas
Das sich die Breite nicht automatisch an den Text anpasst, liegt daran, dass ein div ein block - Element ist. Dieses versucht immer (wenn keine Breitenangabe definiert ist) den gesamten Platz voll auszunutzen.
Eine einfache Möglichkeit ist es hier das ganze zu einem inline - Element umzukehren.
Dieses sieht dann so im CSS - Code aus:
Zitat:
#Titel2{
height: 20px;
background: url(http://muepfe-radio.square7.ch/WebQuark/Design/titel2.PNG);
margin: 35px 0px 0px 70px;
padding: 16px 0px 0px 3px;
display: inline;
}
|
|
|
↑
|
|
|
-
muepfe-radio
|
04.06.2010 um 17:12 (UTC)
Titel: |
|
|
Hi,
jetzt wollte ich den nach den Titel sofort diese Grafik hier kommen lassen:
Jedoch muss diese Grafik automatisch nach dem Titel2 kommen.
Doch das funktioniert leider nicht:
-> de333.de.tl/Kontakt.htm
Grüße
Andreas
Zuletzt bearbeitet von muepfe-radio am 04.06.2010, 18:13, insgesamt einmal bearbeitet
|
|
|
↑
|
|
|
-
southpark-comedyclub
|
04.06.2010 um 17:48 (UTC)
Titel: |
|
|
So sollts funktionieren habe es ausprobiert, bei Titel 2 musst du dann die Überschrift schreiben:
CSS Code:
Zitat:
#titel1 {
width: 38px;
height: 35px;
float: left;
background-image: url(http://muepfe-radio.square7.ch/WebQuark/Design/Titel1.PNG);
}
#titel2 {
height: 37px;
float: left;
background-image: url(http://muepfe-radio.square7.ch/WebQuark/Design/titel2.PNG);
}
#titel3 {
width: 36px;
height: 37px;
float: left;
background-image: url(http://muepfe-radio.square7.ch/WebQuark/Design/Titel3.PNG);
}
HTML - Code
Zitat:
<div id="titel1"></div><div id="titel2">Dein Titel</div><div id="titel3"></div>
|
|
|
↑
|
|
|
-
muepfe-radio
|
04.06.2010 um 18:10 (UTC)
Titel: |
|
|
Hi,
danke, habs hinbekommen.
Grüße
Andreas |
|
|
↑
|
|
|
|
