XHTMLforum

XHTMLforum (http://xhtmlforum.de/index.php)
-   CSS (http://xhtmlforum.de/forumdisplay.php?f=73)
-   -   ::: kleine starthilfe ::: (http://xhtmlforum.de/showthread.php?t=43454)

benzrecordings 15.12.2006 11:55

::: kleine starthilfe :::
 
erstmal wollt ich hier ein dickes lob loswerden! hier wird einem schnell und nett geholfen, gar nicht mehr so häufig, dass es gute foren gibt! daumen hoch.

kurz zur geschichte, ich habe mitt unserer band homepage ziemliche probleme, weil ich die vor nem jahr gemacht habe ohne wirklich ahnung zu haben. jetzt wurde mir unter anderem auch hier im forum angeraten, das ganze neu zu machen. das habe ich auch vor. die inhalte stehen ja soweit.


bevor ich jedoch wieder alles falsch mache, wollte ich euch hier um rat und nach meinung fragen. einen schönheitsfehler gibts, und den kann ich auch nicht ändern. ich muss mit frames arbeiten, um oben auf der seite einen flash musicplayer ein zu binden. auf diese feature kann ich leider nicht verzichten.

das layout will ich dann komplett mit divs gestalten, aber da hakts schon. so solls aussehen:

http://www.avid-music.de/homepage_avid_neu.gif

hab jetzt mal die divs eingezeichnet, wie ich denke dass es gehen könnte, berichtigt mich wenn das schwachsinnig so ist. hatte jetzt überlegt im css für den body, eine grafik zu machen die sowohl die hintergrundtapete als auch die weiße contenbox enthält, also so ein schmaler streifen, der ganz breit ist, und von oben nach unten immer wiederholt wird...

bei der quicknavi wollte ich dann dementsprechend für jede box noch ein div einfügen. ist dass sinnvoll? also "Div newsletter" usw...

bin auch noch am rätseln wie ich den schlagschatten hinter die quicknavikästen bekomme.... png wird ja vom E nicht erkannt...

also für ideen anregungen, tipps wäre ich sehr dankbar. vielleicht schaff ichs ja diesmal eine ordentlich programmierte seite zu bauen ...

benzrecordings 15.12.2006 16:46

steh schon vor dem ersten problem :(
hab mich dazu entschieden die navigation rein typografisch zu gestalten also komplett ohne bilder...

dazu habe ich im css die linkeigenschaften über a link, a hover, a active vergeben. das funktioniert auch soweit. allerdings will ich im DIV navigation wo sich logischerweise auch links befinden andere eigenschaften definieren, vor allem der unterstrich soll weg. hab dann also im div navigation, andere eigenschaften definiert aber die werden nicht angenommen. kann ich irgendwie verhindern, dass da die eigenschaften von oben greifen, und extra eigenschaften definieren?

fricca 15.12.2006 17:14

Ohne Code kann dir niemand helfen.
Lies bitte: http://xhtmlforum.de/40080-fuer-frag...twortende.html

benzrecordings 15.12.2006 17:48

ok, stimmt. also ich habe im css die eigenschaften für die links folgendermaßen definiert:

Code:

a:link {
        color: #000000;
        font-size: 10px;
        text-decoration: underline;       
}
a:visited {
        color: #666666;
text-decoration: underline;       
        font-size: 10px;
}
a:hover {
        color: #990000;
        text-decoration: underline overline blink;
        font-size: 10px;
}

ich benutze in der navigation auch links, die sollen aber anders aussehen. hab also die links, die im div navi liegen, versucht zu formatieren:
Code:

#navigation {
        float: left;
        width: 480px;
        margin-right: auto;
        margin-left: 140px;
        height: 206px;
        font-family: Geneva, Arial, Helvetica, sans-serif;
        text-decoration: none;
        font-size: 10px;
        font-style: normal;
        font-weight: bolder;
        font-variant: small-caps;
        color: #000000;
        position: fixed;
}

aber irgendwie nehmen die die eigenschaften nicht an.

ein zweites problem ist, das dass div vagigation und quicknavi nebeneinenader positioniert sind, und die eigenschaft fixed haben, habs mit float versucht die nebeneinander zu kriegen aber irgendwie wird immer umgebrochen!

hier hab ich mal die beispielseite hochgeladen:
klick

fricca 15.12.2006 17:59

Eine Navigation gehört in eine Liste.
Lesestoff: Vorsprung durch Webstandards | Retro-Coding: Semantischer Code ist der Anfang von gutem Design
Wenn du optische Trenner willst, dann verwende Hintergrundbilder.

Die Links der Navigation sprichst du mit #navigation a an.
Grundlagenlektüre:
CSS 4 You - The Finest in Stylesheets: Workshop CSS: Allgemeines

Ein Element, das fixed positioniert ist, kann nicht mehr floaten.
Eine "quicknavi" kann ich nirgends finden (und "vagigation" auch nicht :roll:).

benzrecordings 15.12.2006 19:28

hey, danke für die links. hab mir das mal angeschaut und die navigation jetzt in einer liste gemacht. die grafiken hab ich dann in den hintergrund des divs gelegt, und die links für die navigation angepasst. bin jetzt schon ein ganzes stück weiter. allerdings hab ich das problem mit den beiden div´s die nebeneinander stehen noch nicht gelöst.

ich versuchs noch mal richtig zu erklären. also ich habe ein div "navigation" und ein div "sidenavigation". beide haben die position fix nd sollten nebeneinander stehen. das tun sie aber nicht. sie stehen untereinander, wie man auf der seite sehen kann: klick

das css für die beiden divs sieht jetzt so aus:

Code:

#navigation {
        width: 480px;
        margin-right: auto;
        margin-left: 140px;
        height: 193px;
        background-color: #FFFFFF;
        background-image: url(head.jpg);
        background-repeat: no-repeat;
        position: fixed;
        background-position: left top;
}

#sidenavigation {
        width: 200px;
        height: 472px;
        left: 680px;
        top: 0px;
        position: fixed;
}

das einzige was ich bei google gefunden habe zum thema div´s nebeneinader war "float" aber das funktioniert bei fixed ja nicht.

das zweite kleine problem ist die schrift. ich habe im body einmal die schrift definiert, sonst niergendwo. dann wird die ja überall angewendet. allerdings sieht die in der navigation ganz anders aus als in der sidenavigation. ich komm nicht drauf was falsch ist. für den fliesstext habe ich noch ne extra klase gemacht.

mhm, kannst du mir nochmal helfen...

fricca 15.12.2006 19:34

Durch die fixe Positionierung wird deine Seite unbenutzbar.
Mach das Fenster mal so klein, dass du scrollen musst.
Entferne sie.

benzrecordings 15.12.2006 19:42

ok, ich will ja nicht zwingend fix verwenden, ich will nur, dass die navigation fest steht und nicht mit scrollt. und die sidenavigation soll auch rechts daneben stehen. hab auch schon rumprobiert aber dann scrollt ja alles immer mit. ich will nur den text scrollen und den rest fest haben.

was kann ich da denn machen?

fricca 15.12.2006 19:49

Zitat:

Zitat von benzrecordings (Beitrag 318008)
was kann ich da denn machen?

Nicht machen.
Verwende den normalen Scroll-Mechanismus des Browsers.

Fixe Positionierung eignet sich nur für sehr kleine Seitenbereiche.

benzrecordings 15.12.2006 20:11

ok, du hattest recht! hans jetzt mal geändert. wenn ich den browser jeztt klein zieh und nach links scroll verschiebt sich der text natürlich über der hintergrundgrafik und drüber hinaus. ich würd aber schon gerne nen schlagschatten verwenden. was würdest du machen. das so lassen oder lieber ne png hinter das div legen? dann müste ich irgendwie tricksen, damit das im IE richtig dargestellt wird oder?


zudem bekomm ich immer noch nicht die schrift in der navi richtig hin ! :?


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

Powered by vBulletin® Version 3.8.11 (Deutsch)
Copyright ©2000 - 2021, vBulletin Solutions, Inc.

© Dirk H. 2003 - 2020