| Autor |
Nachricht |
artis
Threadersteller
Dabei seit: 18.10.2006
Ort: Wien
Alter: 35
Geschlecht: 
|
Verfasst Sa 18.08.2007 04:21
Titel Horizontale Liste - Abstand zwischen li's verkleinern |
  |
|
Hallo,
ich hab eine Horizontale Liste erstellt, schaut so aus:
| Code: | <div id="mainMenu">
<ul>
<li><img src="./images/navRegister.png" alt="" title="" /></li>
<li><img src="./images/navMembers.png" alt="" title="" /></li>
<li><img src="./images/navHelp.png" alt="" title="" /></li>
<li><img src="./images/navImprint.png" alt="" title="" /></li>
</ul>
</div> |
Mein Problem ist, das es zwischen den images immer Abstände gibt die weggehören. Wie kriege ich diese Weg?
Css:
| Code: | #mainMenu { text-align: right; margin: 0; padding: 9px 69px 0 0;}
#mainMenu li {
display: inline;
list-style-type: none;
padding-right: 0px;
margin: 0px;
} |
Ich danke euch schonmal 
EDIT:
Hab das Problem nun mit floats gelöst.
Könnt ihr euch evtl. das angucken ob das optimal ist?
| Code: | <div id="page">
<a id="top"></a>
<div id="leftSide">
<div id="mainMenu">
<ul>
<li><a href="#"><img src="./images/navRegister.png" alt="" title="" /></a></li>
<li><a href="#"><img src="./images/navMembers.png" alt="" title="" /></a></li>
<li><a href="#"><img src="./images/navHelp.png" alt="" title="" /></a></li>
<li><a href="#"><img src="./images/navImprint.png" alt="" title="" /></a></li>
</ul>
</div>
<p id="fuLogo" class="left"><a href="#"><img src="./images/wbbfactory-logo.png" alt="" title="" /></a></p>
<p id="searchBox"><img src="./images/searchBoxBg.png" alt="" title="" /></p>
<div class="clear"></div>
main
<br /><br /><br /><br /><br /><br /><br /><br /><br /><br />
</div>
<div id="rightSide">
<img src="./images/sideBarMenu.png" alt="" title="" />
<ul id="sideBar">
<li>» <a href="#">Mein Profil</a></li>
<li>» <a href="#">Private Nachrichten</a></li>
<li>» <a href="#">Abonnements</a></li>
<li>» <a href="#">Statistik</a></li>
<li>» <a href="#">Datenbank</a></li>
</ul>
<br /><br /><br />
rightSide
</div>
</div> |
hab da noch eine Probleme mit der rightSide, wenn mir einer helfen will bitte melden.
Ich werd den jenigen ne PM mim Link schicken.
Zuletzt bearbeitet von artis am Sa 18.08.2007 07:15, insgesamt 1-mal bearbeitet
|
|
| |
  |
 |
dastef
Dabei seit: 03.11.2003
Ort: -
Alter: -
Geschlecht:
|
Verfasst Sa 18.08.2007 12:12
Titel
|
|
|
Ne Navi die aus Bildern ohne Alt-Text besteht? .. Ich würd mich
mal mit Image-Replacement beschäftigen
|
|
| |
|
|
|
Anzeige
|
|
|
artis
Threadersteller
Dabei seit: 18.10.2006
Ort: Wien
Alter: 35
Geschlecht:
|
Verfasst Sa 18.08.2007 17:43
Titel
|
|
|
Alt-Texte kommen noch rein Lächel Wieso sollte ich mit Image-Replacement arbeiten? Was bringt mir das, wenn ich immer verschiedene Buttons habe?!
so hab nun eingiges fertig, hab da nur ein Problem mit der Browserkompilität
das ganze schaut bei FF2 okey aus aber bei ie6 und ie7 schauts wieder kagge aus.
Woran kann das liegen? Was hab ich falsch gemacht?
KLICK MICH!
Ich bitte um eine Rückmeldung
lg
artisya
|
|
| |
|
|
nicoG
Dabei seit: 25.01.2006
Ort: Freiburg
Alter: -
Geschlecht:
|
Verfasst Sa 18.08.2007 18:32
Titel
|
|
|
Ein Grund ist der XML-Prolog: <?xml version="1.0" encoding="UTF-8"?>
Pack den weg, dann klappt es ein wenig besser im IE 
Warum? Darum
Wegen image-Replacement: Es gibt viele Menschen mit Behinderungen, die auch recht viel im Internet herumsurfen. Ohne Image-Replacement (oder das Ganze mit Hintergrunddbildern lösen) kann der User, der einen Screenreader hat beispielsweise, nicht durch die Seiten navigieren
|
|
| |
|
|
artis
Threadersteller
Dabei seit: 18.10.2006
Ort: Wien
Alter: 35
Geschlecht:
|
Verfasst Sa 18.08.2007 18:45
Titel
|
|
|
| nicoG hat geschrieben: | Ein Grund ist der XML-Prolog: <?xml version="1.0" encoding="UTF-8"?>
Pack den weg, dann klappt es ein wenig besser im IE
Warum? Darum
Wegen image-Replacement: Es gibt viele Menschen mit Behinderungen, die auch recht viel im Internet herumsurfen. Ohne Image-Replacement (oder das Ganze mit Hintergrunddbildern lösen) kann der User, der einen Screenreader hat beispielsweise, nicht durch die Seiten navigieren |
Hallo,
ich hab das XML-Prolog entfernt hat sich aber fast nichts geändert. Hab ich irgendwas mit den floats falsch? oder die divs falsch aufgebaut?
Bei der I-Replacement verwende ich dei Dwyer-Methode is das in Ordnung?!
|
|
| |
|
|
nicoG
Dabei seit: 25.01.2006
Ort: Freiburg
Alter: -
Geschlecht:
|
Verfasst Sa 18.08.2007 19:12
Titel
|
|
|
| artis hat geschrieben: |
Hab ich irgendwas mit den floats falsch? oder die divs falsch aufgebaut? |
Beides. Semantisch ist das alles noch nicht ganz einwandfrei
Ich würde alle Grafiken, die du für Layoutzwecken auf die Seite gehauen hast, als Hintergrunddbild einbauen. Bei dem Logo würde ich dann h1-Tag benutzen, das Logo als BG definieren und in den Tag dann reinschreiben: "wbbfactory - some kind of innovation". Diesen TExt dann durch einen hohen negativen Wert bei text-indent verschwinden lassen
Menu siehe hier
Dein Problem mit dem IE würde ich darauf beziehen, dass du das Floaten nicht wieder Clearst Du hast zwar ein "cleafix" drin, aber du hast es nicht definiert.
Gib ihm ein clear:both; mit
|
|
| |
|
|
artis
Threadersteller
Dabei seit: 18.10.2006
Ort: Wien
Alter: 35
Geschlecht:
|
Verfasst Sa 18.08.2007 19:23
Titel
|
|
|
| nicoG hat geschrieben: | | artis hat geschrieben: |
Hab ich irgendwas mit den floats falsch? oder die divs falsch aufgebaut? |
Beides. Semantisch ist das alles noch nicht ganz einwandfrei
Ich würde alle Grafiken, die du für Layoutzwecken auf die Seite gehauen hast, als Hintergrunddbild einbauen. Bei dem Logo würde ich dann h1-Tag benutzen, das Logo als BG definieren und in den Tag dann reinschreiben: "wbbfactory - some kind of innovation". Diesen TExt dann durch einen hohen negativen Wert bei text-indent verschwinden lassen
Menu siehe hier
Dein Problem mit dem IE würde ich darauf beziehen, dass du das Floaten nicht wieder Clearst Du hast zwar ein "cleafix" drin, aber du hast es nicht definiert.
Gib ihm ein clear:both; mit |
Hallo,
danke für die tolle Antwort werd mich gleich ranmachen
Also das Problem mit den divs ist, ich denk es sind einige drin die garnicht drin sein müssten oder?
und das mim clearfix, wann muss ich das immer schreiben? Nachdem ich das float element benützt habe?
|
|
| |
|
|
nicoG
Dabei seit: 25.01.2006
Ort: Freiburg
Alter: -
Geschlecht:
|
Verfasst Sa 18.08.2007 19:35
Titel
|
|
|
| artis hat geschrieben: |
Also das Problem mit den divs ist, ich denk es sind einige drin die garnicht drin sein müssten oder? |
Ist zur Zeit noch grenzwertig. Wenn du sie wirklich nicht brauchst (beispielsweise, um mehrere Hintergrundbilder einzufügen), dann könntest du bspsw. das Div um die Navigation oben "userMenu" entfernen und diese ID einfach der Liste zuweisen. Ist ja auch ein Blockelement und reagiert genau gleich
Ansonsten kannst du es so lasssen, nur eben noch die Paragraphen (<p>) da oben weg und semantisch korrekte Tags nehmen, wie ein h-Tag. Die Suche wirst du ja dann auch noch reincoden müssen, dort kannst du dann ruhig ein div beispielsweise nehmen
| artis hat geschrieben: |
und das mim clearfix, wann muss ich das immer schreiben? Nachdem ich das float element benützt habe? |
Das hier hat mir sehr geholfen, das Ganze zu verstehen
http://www.andreas-kalt.de/webdesign/tutorials/float-theorie
|
|
| |
|
|
| |
|
|
| Ähnliche Themen |
Abstand zwischen 2 <UL> Elemente verkleinern
Horizontale ul-Navi
Horizontale Scrolleiste im IE
CSS: Horizontale Linie unendlich
Horizontale Navigation mit CSS und DIV layern
JQuery: Horizontale Scrollbar
|
|
Willkommen auf dem Portal für Mediengestalter
