tutorials.de Buch-Aktion 05/2012
ERLEDIGT
JA
ANTWORTEN
8
ZUGRIFFE
7277
EMPFEHLEN
  • An Twitter übertragen
  • An Facebook übertragen
DIESES THEMA IST
GESCHLOSSEN
  1. 28.01.08 12:36 #1
    Gunah Gunah ist offline Mitglied Brokat
    Registriert seit
    Feb 2005
    Beiträge
    371
    moin allerseits.

    ich habe folgendes Problem ich habe eine Liste die als Menü dienen soll gefloatet...

    nur leider wird es nicht mittig gesetzt mit (text-align:center; margin:0px auto...

    display:inline, macht mir zwischen den Einträgen leider immer leerzeilen... und das geht leider bei dem Menu nicht

    hier mal der SRC:
    CSS:
    Code :
    1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30

    .menu 
{
    text-align:center;
    margin:0px auto;
    height:43px;
    display:block;
}
.menu ul {
    text-align:center;
    margin:0px auto;
    list-style-type:none;
    padding:0px;
    margin:0px;
    width:80%;
}
.menu ul li {
    text-align:center;
    margin:0px auto;
    list-style-type:none;
    padding:0px;
    margin:0px;
    margin-bottom:-5px;
    display:block;
    float:left;
    background-image:url('../images/menu/spacer.jpg');
    background-position:top left;
    background-repeat:repeat-x;
    padding-left:1px;
    padding-right:1px;
}
    hier HTML:
    HTML-Code:
                <div class="menu">
            <ul>
              <li class="activ"><img src="images/menu/home.jpg" alt="Startseite" /></li>
              <li><img src="images/menu/home.jpg" alt="Startseite" /></li>
              <li><img src="images/menu/home.jpg" alt="Startseite" /></li>
              <li><img src="images/menu/home.jpg" alt="Startseite" /></li>
            </ul>
            </div>
    danke schonmal im vorraus

    Gruß
    Gunah
     
    Meine Private Homepage: www.gunah.eu
  2. 28.01.08 12:39 #2
    Maik Tutorials.de Gastzugang
    Hi,

    Stu Nicholls' Beispiel Centering Float Left Menus dürfte dir da weiterhelfen.
     
  3. 28.01.08 13:01 #3
    Gunah Gunah ist offline Mitglied Brokat
    Registriert seit
    Feb 2005
    Beiträge
    371
    danke , leider nicht da meine Einträge Verschieden gross sind

    sonst hat einer eine Lösung, wie es mit display:inline geht, sodass es keine Leerzeichen zwischen den beiden nebeneinander gelegten LIs macht.
     
    Meine Private Homepage: www.gunah.eu
  4. 28.01.08 13:03 #4
    Maik Tutorials.de Gastzugang
    Zitat Zitat von Gunah Beitrag anzeigen
    danke , leider nicht da meine Einträge Verschieden gross sind
    Dann hast du dir die Beispiele nicht richtig angeschaut, denn die zweite Variante gilt für ein Menü mit unbekannter Breite.
     
  5. 28.01.08 13:10 #5
    Gunah Gunah ist offline Mitglied Brokat
    Registriert seit
    Feb 2005
    Beiträge
    371
    stimmt das 2te Modell macht es mittig ... *an kopf fass*

    nur für den IE 6 nicht, da muss ich dann noch mal gucken und probieren ob es dafür eine Varinate gibt...
    (also mit dem Codeschnipsel von unten in der oberen Demo geht es)
     
    Meine Private Homepage: www.gunah.eu
  6. 28.01.08 13:13 #6
    Maik Tutorials.de Gastzugang
    Hast du auch diesen Teil des Codes übernommen?

    Code :
    1
2
3
4
5
6
7
8
9
10
11

    <!--[if lt IE 7]>
<style type="text/css">
#menu2 li {
  float:left;
  }
#menu2 a {
  float:left;
  }
.container {display:inline-block;}
</style>
<![endif]-->
     
  7. 28.01.08 13:21 #7
    Gunah Gunah ist offline Mitglied Brokat
    Registriert seit
    Feb 2005
    Beiträge
    371
    ne hatte ich nicht aber ergebnis ist das gleiche, wie vorher im kleiner als IE7

    Gruß
    Mathis
     
    Meine Private Homepage: www.gunah.eu
  8. 28.01.08 13:33 #8
    Maik Tutorials.de Gastzugang
    Bei mir funktioniert's im IE6 einwandfrei:

    Code :
    1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69

    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
  "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=ISO-8859-1">
<meta name="author" content="Maik">
<title>tutorials.de | demo_Gunah</title>
 
<style type="text/css">
<!--
#info {
  text-align:center;
}
 
#menu2 {
  display:table;
  padding:0;
  margin:0 auto;
  list-style-type:none;
  white-space:nowrap;
  }
#menu2 li {
  display:table-cell;
  }
#menu2 a {
  width:auto;
  display:block;
  padding:4px 16px;
  color:#fff;
  background:#08c;
  border:1px solid #fff;
  text-decoration:none;
  }
#menu2 a:hover {
  color:#000;
  background:#d4d4d4;
  }
 
.container {clear:both; text-decoration:none;}
-->
</style>
<!--[if lt IE 7]>
<style type="text/css">
#menu2 li {
  float:left;
  }
#menu2 a {
  float:left;
  }
.container {display:inline-block;}
</style>
<![endif]-->
 
</head>
<body>
 
<div id="info">
     <del class="container">
          <ul id="menu2">
              <li><a href="#nogo">Tab One</a></li>
              <li><a href="#nogo">Tab Two: Longer</a></li>
              <li><a href="#nogo">Tab Three: Longest</a></li>
              <li><a href="#nogo">Tab Four</a></li>
          </ul>
     </del>
</div>
 
</body>
</html>
     
  9. 28.01.08 14:06 #9
    Gunah Gunah ist offline Mitglied Brokat
    Registriert seit
    Feb 2005
    Beiträge
    371
    hab gerade mal diff gemacht, alter hab ich heut Buchstabendreher drin geht garnicht...

    naja bald ist wieder WE *gg*

    danke an dieser Stelle

    Gruß
    Gunah
     
    Meine Private Homepage: www.gunah.eu
« IE6 und CSS(fka IE6 und Javascipt) | design-problem: überall siehts anders aus »

Ähnliche Themen

  1. Bild links mittig floaten lassen?
    Von Layna im Forum CSS
    Antworten: 2
    Letzter Beitrag: 30.01.08, 09:24
  2. Liste links ausrichten aber anders herum floaten
    Von blubbbla im Forum CSS
    Antworten: 3
    Letzter Beitrag: 04.10.07, 17:43
  3. Bild vertikal und horizontal mittig ausrichten?
    Von siob im Forum CSS
    Antworten: 9
    Letzter Beitrag: 24.03.06, 08:13
  4. Ausrichtung im Browserfenster horizontal mittig
    Von Haarentferner im Forum HTML & XHTML
    Antworten: 14
    Letzter Beitrag: 20.10.05, 15:08
  5. frameset horizontal und vertikal mittig ausrichten und feste Größe zuweisen!?
    Von Eddymaniac im Forum HTML & XHTML
    Antworten: 1
    Letzter Beitrag: 23.08.05, 11:34