zurück zur Startseite
  


Zurück XHTMLforum > (X)HTML und CSS > CSS
Seite neu laden Hilfe zum Anpassen einer CSS-Vorlage benötigt

Antwort
 
LinkBack Themen-Optionen Ansicht
  #1 (permalink)  
Alt 13.11.2009, 23:42
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 13.11.2009
Beiträge: 2
Sergeant befindet sich auf einem aufstrebenden Ast
Frage Hilfe zum Anpassen einer CSS-Vorlage benötigt

Hallo,
ich blicke nicht mehr durch und bitte um Eure Hilfe!

Habe als Template für meine Website folgende Vorlage von mitchinson.net genommen:
*LIMEGREEN*

Folgende Anpassungen möchte ich vornehmen, bekomme das aber nicht hin:
1) Die linke, vertikale (Navigations-)Spalte soll farbigen Hintergrund bekommen
Die Hintergrundfarbe (z.B. ein Grauton) soll aber auch angezeigt werden, wenn kein Text in der Spalte steht, wenn die Spalte komplett leer ist.
Wie mache ich das ?

2)Kann man die horizontale Navigation so aufteilen, dass sich die Menüpunkte genau auf die Breite des Bildes verteilen? Mich stört der grüne Balken hinter dem letzten Punkt "Link five"

3) Wenn man sich die Seite stark verkleinert im Browser ansieht stellt man fest, dass der Seitenhintergrund (grau - weiss - grau) 'unendlich' fortgesetzt wird. Ich möchte dass er zusammen mit der grünen Footer Zeile abschließt, die Lage der Footer-Zeile sollte sich nach der Textmenge in den Spalten über ihr richten. Wie kann ich das erreichen?

Danke für jeden Hinweis!
Gruß
Sergeant
Mit Zitat antworten
Sponsored Links
  #2 (permalink)  
Alt 14.11.2009, 00:02
{ display: random;}
XHTMLforum-Kenner
 
Registriert seit: 08.09.2004
Ort: Stuttgart
Beiträge: 5.034
andir ist ein wunderbarer Anblickandir ist ein wunderbarer Anblickandir ist ein wunderbarer Anblickandir ist ein wunderbarer Anblickandir ist ein wunderbarer Anblickandir ist ein wunderbarer Anblick
Standard

1.

Dein vertikales Menu liegt in einer

Code:
<div class="sidebar"></>
CSS:

Code:
div.sidebar {
background-color: aaa;
}
(Farbe nur als Beispiel eingesetzt)


2.
Links in horizontaler Navigation:

Ändere bei den Links #navbar a folgende Breite ( im CSS-File suchen
Von 6em (derzeitiger Wert) ändern auf: 17%.
Der letzte Link muss eine id erhalten. Trage ins CSS ein:
#navbar a#last {
border-right: 0;
}
Ändere das HTML an genau dieser Stelle in: (letzter Link dort)
Code:
<a id="last">dein Text</a>
3. Dein Wunsch ist für die Praxis vollkommen irrelevant. Mein Ernst. Niemand, wirklich niemand ausser Dir wird sich die Seite verkleinert im Browser anschauen. Falls Du es doch versuchen willst und für alle Fälle), empfehle ich:

Einführung in XHTML, CSS und Webdesign - Michael Jendryschik
__________________
Grüsse Andreas- auch mal wieder da...

Design isn't about the tools, it's about creating the best experience for the user. A design should be based on usability, accesibility, aesthetics, but never on floats, lists or background images. ( by Cameron Adams)
Wiedergelesen: > hier und hier

[Foren-Links] Dein Post? Klar, DAS vorher gelesen? Hilft. ## User-Landkarte
Mit Zitat antworten
Sponsored Links
  #3 (permalink)  
Alt 14.11.2009, 02:35
Benutzerbild von plastiko
Erfahrener Benutzer
XHTMLforum-Mitglied
 
Registriert seit: 26.12.2007
Ort: Hannover
Beiträge: 945
plastiko ist ein Lichtblickplastiko ist ein Lichtblickplastiko ist ein Lichtblickplastiko ist ein Lichtblickplastiko ist ein Lichtblick
Standard

Zitat:
Zitat von andir Beitrag anzeigen
3. Dein Wunsch ist für die Praxis vollkommen irrelevant.
Aber nur wenn die Seiten immer so schön mit Inhalt gefüllt sind.

Wenn html selber einen Hintergrund bekommt wird der von body auch nur in der Höhe von body (bestimmt durch #container) angezeigt.
Code:
html {
background: #ffffff;
}
Aber auf das wirklich besser aussieht?
__________________
MfG
Jens

Geändert von plastiko (14.11.2009 um 02:48 Uhr) Grund: Ob das wirklich besser aussieht?
Mit Zitat antworten
  #4 (permalink)  
Alt 14.11.2009, 20:43
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 13.11.2009
Beiträge: 2
Sergeant befindet sich auf einem aufstrebenden Ast
Standard

Hallo andir,

danke für deine Tipps, die Navigationsleiste sieht jetzt bestens aus.
Zitat:
Zitat von andir Beitrag anzeigen
1.
Code:
div.sidebar {
background-color: aaa;
}
Hier sieht man die Hintergrundfarbe leider nur dort, wo auch Text in der #sidebar steht.
Die #sidebar kann aber auch leer sein und soll auch dann ihre Hintergrund-Farbe anzeige, die Höhe der #sidebar sollte sich nach der Höhe #content-Bereiches in der Mitte richten.

Wie könnte ich das realisieren?

Danke!
Gruß
Sergeant
Mit Zitat antworten
  #5 (permalink)  
Alt 15.11.2009, 12:48
Erfahrener Benutzer
XHTMLforum-Mitglied
 
Registriert seit: 31.01.2006
Beiträge: 146
Smartsoul befindet sich auf einem aufstrebenden Ast
Standard

Vor den Code für die Farbe muss in jedem Fall eine # sonst geht nix.
Code:
div.sidebar {
background-color: #aaa;
}
__________________
Danke an alle, die sich hier engagieren
Mit Zitat antworten
  #6 (permalink)  
Alt 15.11.2009, 14:42
Benutzerbild von plastiko
Erfahrener Benutzer
XHTMLforum-Mitglied
 
Registriert seit: 26.12.2007
Ort: Hannover
Beiträge: 945
plastiko ist ein Lichtblickplastiko ist ein Lichtblickplastiko ist ein Lichtblickplastiko ist ein Lichtblickplastiko ist ein Lichtblick
Standard

#sidebar ist nur so hoch wie ihr Inhalt.

#container schließt (unter anderem) #sidbar und #content ein.
- und ist somit immer mindestens so hoch wie die höhere der beiden Spalten.

Gebe #container eine Hintergrundgrafig in der Breite von #sidebar.

Code:
#container {
background: #ccc url(images/bg/aaa-160px.gif) 0 0 repeat-y;
}
Die Technik ist als Faux Columns bekannt:
http://little-boxes.de/lb1/16.1.6-sc...avigation.html
__________________
MfG
Jens

Geändert von plastiko (15.11.2009 um 14:56 Uhr) Grund: little boxex
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
Redesign für Steiner Cycling Team pkipper Site- und Layoutcheck 11 09.02.2011 12:25
Hilfe bei CSS Navigation trimalchio CSS 7 10.01.2011 13:13
Hilfe bei CSS Desing Umsetzung. Frosti1986 CSS 7 27.02.2010 13:08
CSS Experten Hilfe benötigt! klappauge CSS 10 25.11.2007 13:37
Css navi problem IE 6 HILFE.... slave (X)HTML 9 28.10.2007 13:07


Alle Zeitangaben in WEZ +2. Es ist jetzt 12:06 Uhr.