zurück zur Startseite
  


Zurück XHTMLforum > (X)HTML und CSS > CSS
Seite neu laden Problem mit Design

Antwort
 
LinkBack Themen-Optionen Ansicht
  #1 (permalink)  
Alt 10.07.2007, 21:48
Benutzerbild von Despairing
Despairing.org
XHTMLforum-Mitglied
Thread-Ersteller
 
Registriert seit: 31.05.2006
Beiträge: 277
Despairing befindet sich auf einem aufstrebenden Ast
Unglücklich Problem mit Design

Ich habe ein Problem mit dem Design *entfernt* (Editiert: Jetzt *entfernt*; siehe Beitrag 6).
Die dazugehörige CSS-Datei ist *entfernt* zu finden.

Es wäre echt super nett, wenn mir hier jemand helfen kann. Ich bin wirklich ratlos.

Die Probleme sind folgende:
  • Auf der rechten Seite (Navigation) soll weiter unten anstatt des sehr großen grauen Balkens ein weißer Hintergrund sein.
  • Der Bereich "Mehr Informationen." (Navigation) soll kein eigener Bereich sein, sondern direkt unterhalb (mit Zeilenumbruch) unter der Beschreibung (unter "PC und Webdesign") sein. Beim Überfahren mit der Maus über diesen Bereich soll auch kein roter Hintergrund erscheinen.
  • In der Navigation soll links neben den Links eine kleine Grafik dargestellt werden.
  • Im Content-Bereich bei "Besucher" soll die rote Listengrafik durch einen roten Kreis (wie auf der Grafik) ersetzt werden.

Ich bitte um eure Hilfe!
__________________
www.despairing.org

Geändert von Despairing (13.07.2007 um 01:54 Uhr)
Mit Zitat antworten
Sponsored Links
  #2 (permalink)  
Alt 10.07.2007, 23:55
Benutzerbild von kadees
Erfahrener Benutzer
XHTMLforum-Mitglied
 
Registriert seit: 22.06.2004
Ort: in Baden (nicht Schwaben)
Beiträge: 792
kadees wird schon bald berühmt werden
Standard

Zitat:
Auf der rechten Seite (Navigation) soll weiter unten anstatt des sehr großen grauen Balkens ein weißer Hintergrund sein.
Ändere deine Hintergrundgrafik und informiere dich über *faux columns*. (s.a. FaQ Punkt 1) )

Zitat:
Der Bereich "Mehr Informationen." (Navigation) soll kein eigener Bereich sein, sondern direkt unterhalb (mit Zeilenumbruch) unter der Beschreibung (unter "PC und Webdesign") sein. Beim Überfahren mit der Maus über diesen Bereich soll auch kein roter Hintergrund erscheinen.
Gib dem Link eine eigene Klasse, in der du die Vorder- und Hintergrundfarbe bei :hover so wie dus haben willst definierst.

Zitat:
In der Navigation soll links neben den Links eine kleine Grafik dargestellt werden.
Machs wie im Bereich *Besucher": weise dem Link eine entsprechende Hintergrundgrafik zu.

Zitat:
Im Content-Bereich bei "Besucher" soll die rote Listengrafik durch einen roten Kreis (wie auf der Grafik) ersetzt werden.
Ändere die Hintergrundgrafik!
Code:
list-style-image: url(img/li.gif);
__________________
Gruss Dieter

Vegetarier essen meinem Essen das Essen weg.
Und unsere Norweger sind reine Karnivoren.

selfhtml | css4you | jendryschik | styleworks | Webdesign mit XHTML und CSS
Mit Zitat antworten
Sponsored Links
  #3 (permalink)  
Alt 11.07.2007, 00:49
Benutzerbild von Despairing
Despairing.org
XHTMLforum-Mitglied
Thread-Ersteller
 
Registriert seit: 31.05.2006
Beiträge: 277
Despairing befindet sich auf einem aufstrebenden Ast
Standard

1. Ich verstehe das alles mit den "falschen Kolumnen" nicht ... Editiert: Hat sich erledigt. Habe einfach den betroffenen Teil der Grafik weiß gefärbt.

2. Habe ich gemacht. Editiert: Funktionierte nur mit einer ID. Aber "Mehr Informationen." befindet sich weiterhin in einer großen Box.

3. Wie soll ich das denn machen? Denn im Stylesheet ist für die Navigation bereits "padding" vorhanden:
Code:
.link_menu a {
border-bottom: 1px solid #fff;
display: block;
font: bold 1.0em verdana, sans-serif;
height: 18px;
padding: 6px 0 0 10px;
text-decoration: none;
}
Und das "padding", was hier steht, ist für das Positionieren der Links da. Und das "padding" brauche ich ja eigentlich noch für die Grafik.
Habe jedenfalls heute Nachmittag mal folgendes ausprobiert:
Code:
.link_menu a {
background: url(img/arrowright.gif) no-repeat center left;
display: block;
font: bold 1.0em verdana, sans-serif;
height: 18px;
padding: 6px 0 0 10px;
text-decoration: none;
}
Aber dies funktionierte auch nicht.

4. Wollte eigentlich nur wissen, wie ich den Listenpunkt einfärben kann.
__________________
www.despairing.org

Geändert von Despairing (11.07.2007 um 02:23 Uhr)
Mit Zitat antworten
  #4 (permalink)  
Alt 11.07.2007, 09:42
Benutzerbild von kadees
Erfahrener Benutzer
XHTMLforum-Mitglied
 
Registriert seit: 22.06.2004
Ort: in Baden (nicht Schwaben)
Beiträge: 792
kadees wird schon bald berühmt werden
Standard

Sollte so fuktionieren:
Code:
.link_menu a {
background: url(img/arrowright.gif) no-repeat 10px center;
display: block;
font: bold 1.0em verdana, sans-serif;
height: 18px;
padding: 6px 0 0 25px;
text-decoration: none;
}
Übrigens: Ein Menü ist eine Auflistung von Links und gehört daher in eine Liste!

Zitat:
Wollte eigentlich nur wissen, wie ich den Listenpunkt einfärben kann.
z.B. so:
Code:
CSS:
.link_updates li {color: #f00;}
.link_updates li span {color: #000;}

HTML:
<li><span>1 Besucher online.</span></li>
__________________
Gruss Dieter

Vegetarier essen meinem Essen das Essen weg.
Und unsere Norweger sind reine Karnivoren.

selfhtml | css4you | jendryschik | styleworks | Webdesign mit XHTML und CSS

Geändert von kadees (11.07.2007 um 09:48 Uhr)
Mit Zitat antworten
  #5 (permalink)  
Alt 11.07.2007, 12:35
Benutzerbild von Despairing
Despairing.org
XHTMLforum-Mitglied
Thread-Ersteller
 
Registriert seit: 31.05.2006
Beiträge: 277
Despairing befindet sich auf einem aufstrebenden Ast
Standard

Die Sache mit den Grafiken in der Navigation funktioniert auch mit dem Code nicht. Und nun?

Wenn man jetzt in der Navigation auf "Mehr?" klickt und die Maus dabei gedrückt hält, dann merkt man, dass da etwas nicht stimmt, weil die Umrandung unterhalb des Wortes viel weiter geht als überhalb des Wortes. Was soll ich machen?

Ja, habe die Navigation in eine "richtige" Liste gepackt.
__________________
www.despairing.org

Geändert von Despairing (11.07.2007 um 16:04 Uhr)
Mit Zitat antworten
  #6 (permalink)  
Alt 11.07.2007, 17:46
Benutzerbild von Despairing
Despairing.org
XHTMLforum-Mitglied
Thread-Ersteller
 
Registriert seit: 31.05.2006
Beiträge: 277
Despairing befindet sich auf einem aufstrebenden Ast
Standard

Habe *entfernt* mal eine neue Unterseite erstellt und habe den Inhalt der Navigation entfernt, aber der Content wird nicht auf der ganzen Breite dargestellt. Wie kann ich den Content verbreitern? Ich glaube, dass ich dazu irgendwelche div-Bereiche entfernen muss.

Bitte helft mir!
__________________
www.despairing.org

Geändert von Despairing (13.07.2007 um 01:55 Uhr)
Mit Zitat antworten
  #7 (permalink)  
Alt 11.07.2007, 17:57
Benutzerbild von Crizzo
der mit dem Editor kämpft
XHTMLforum-Kenner
 
Registriert seit: 17.10.2006
Ort: Ost-Hessen
Beiträge: 4.828
Crizzo ist ein sehr geschätzer MenschCrizzo ist ein sehr geschätzer MenschCrizzo ist ein sehr geschätzer MenschCrizzo ist ein sehr geschätzer Mensch
Standard

.content steckt in #main_left (den Unterstrich sollte man nicht verwenden).
Da #main_left nur 420px breit ist und .content nur 100% dieser Breite, also wiederrum 420px als width besitzt, wird es auch nicht breiter.
100% heißt, dass das Kinderelement 100% der Breite des Elternelements einnimmt. Hier ist #main_left Elternelement von .content
__________________
Ohne Quelltext gibts selten Hilfe. Also: Onlinebeispiel hochladen und Link bereitstellen!
Foren-FAQ
Mit Zitat antworten
  #8 (permalink)  
Alt 11.07.2007, 18:51
Benutzerbild von Despairing
Despairing.org
XHTMLforum-Mitglied
Thread-Ersteller
 
Registriert seit: 31.05.2006
Beiträge: 277
Despairing befindet sich auf einem aufstrebenden Ast
Standard

Hm, ist total kompliziert.
Habe den gesamten Content-Bereich aus den main_left-div genommen und in den main-div eingefügt. Das Ergebnis habe ich mal auf einer weiteren Unterseite abgespeichert: *entfernt*.

__________________
www.despairing.org

Geändert von Despairing (13.07.2007 um 01:55 Uhr)
Mit Zitat antworten
  #9 (permalink)  
Alt 11.07.2007, 19:07
Benutzerbild von Crizzo
der mit dem Editor kämpft
XHTMLforum-Kenner
 
Registriert seit: 17.10.2006
Ort: Ost-Hessen
Beiträge: 4.828
Crizzo ist ein sehr geschätzer MenschCrizzo ist ein sehr geschätzer MenschCrizzo ist ein sehr geschätzer MenschCrizzo ist ein sehr geschätzer Mensch
Standard

wieso machst du jetzt den Text und alles über den Header?

Die <img>Elemente in Li kannst du dir sparen, dass kann man bei Li als image einbinden. list-style-image: Aufzählungsgrafik: CSS-Referenz auf CSS 4 You - The Finest in Stylesheets
__________________
Ohne Quelltext gibts selten Hilfe. Also: Onlinebeispiel hochladen und Link bereitstellen!
Foren-FAQ
Mit Zitat antworten
Sponsored Links
  #10 (permalink)  
Alt 11.07.2007, 19:50
Benutzerbild von Despairing
Despairing.org
XHTMLforum-Mitglied
Thread-Ersteller
 
Registriert seit: 31.05.2006
Beiträge: 277
Despairing befindet sich auf einem aufstrebenden Ast
Standard

Habe da etwas verwechselt oder so.
Naja, jedenfalls sieht das ganze jetzt etwas anders aus.

Was muss ich nun wie ändern, dass die gesamte Navigation links neben der großen roten Grafik steht?
Außerdem ist der Inhalt des Footer-Bereichs nicht wirklich zentriert.

Habe das mit der Listengrafik für die Navigation so gemacht, wie es da steht und dann in das Stylesheet eingefügt, aber das funktioniert auch nicht.
Der Code dazu:
Code:
.link_menu ul {
list-style-image: url(arrowright.gif) no-repeat;
}
Ich wollte noch dazu sagen, dass ich meinen Quelltext gerne so hätte, dass erst der Header-Bereich, dann der Content- und zum Schluss der Footer-Bereich folgt. Wegen dem Includen. Der ganze Quelltext macht mich total wahnsinnig, weil das so viele div-Bereiche sind. Brauche hier, glaube ich, auch noch Hilfe.
__________________
www.despairing.org
Mit Zitat antworten
Sponsored Links
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
Design problem Starksky (X)HTML 1 14.07.2011 19:53
Float / Container Problem - Total seltsam. einfachder CSS 9 16.07.2008 13:05
Barriererarmes, skalierbares, 3Spaltiges Design (Designkontrolle) tliffcom Site- und Layoutcheck 4 01.03.2008 12:43
Problem mit 3 Spaltigem Layout stipo CSS 0 27.05.2006 21:58
Design mit CSS - ich kriegs nicht hin... chow180976 CSS 6 22.04.2005 12:15


Alle Zeitangaben in WEZ +2. Es ist jetzt 03:41 Uhr.