Ergebnis 1 bis 8 von 8

Thema: Menü mittig setzten

  1. #1
    Samurai Avatar von ludgerf321
    Registriert seit
    19.11.2007
    Ort
    Hannover
    Beiträge
    232
    Danke
    0
    Bekam 0 mal "Danke" in 0 Postings

    Standard Menü mittig setzten

    Hi,
    ich habe mir ein menu zusammengebasstelt und wollte nun wissen, wie ich das ganze im browser mittig setzen kann.
    Ich meine nur die Menüpunkte den Rest krieg ich schon hin.
    http://www.ab-sofort-erfolg.de/test.html

    Danke Ludgerf321[/url]
    Achtung: Dies ist ein alter Thread im HTML und Webmaster Forum
    Diese Diskussion ist älter als 90 Tage. Die darin enthaltenen Informationen sind möglicherweise nicht mehr aktuell. Erstelle bitte zu deiner Frage ein neues Thema im Forum !!!!!

  2. #2
    der/die Göttliche Avatar von jojo87
    Registriert seit
    23.03.2007
    Ort
    Leipzig
    Alter
    30
    Beiträge
    3.131
    Danke
    0
    Bekam 0 mal "Danke" in 0 Postings

    Standard

    z. bsp. mit text-align:center;

  3. #3
    Samurai
    Themenstarter
    Avatar von ludgerf321
    Registriert seit
    19.11.2007
    Ort
    Hannover
    Beiträge
    232
    Danke
    0
    Bekam 0 mal "Danke" in 0 Postings

    Standard

    ja nur wo soll ich das einfügen??

  4. #4
    der/die Göttliche Avatar von jojo87
    Registriert seit
    23.03.2007
    Ort
    Leipzig
    Alter
    30
    Beiträge
    3.131
    Danke
    0
    Bekam 0 mal "Danke" in 0 Postings

    Standard

    ja woher soll ich das denn wissen? Kenn ich deinen Code? Dann musstn uns schon mal zeigen oder nen Link geben.

  5. #5
    Samurai
    Themenstarter
    Avatar von ludgerf321
    Registriert seit
    19.11.2007
    Ort
    Hannover
    Beiträge
    232
    Danke
    0
    Bekam 0 mal "Danke" in 0 Postings

    Standard

    ok
    der link is oban oda hier nochma:
    http://www.ab-sofort-erfolg.de/test.html

    Hier is der Code:
    Code:
    <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
    <html>
    <head>
      <style></style>
      <title>test</title>
    </head>
    <body>
    <div style="text-align&#58; center;">
    <style type="text/css">
    .invertedshiftdown&#123;
    padding&#58; 0;
    width&#58; 100%;
    border-top&#58; 5px solid #FF9900; background&#58; transparent;
    voice-family&#58; "\"&#125;\"";
    voice-family&#58; inherit;
    &#125;
    .invertedshiftdown ul&#123;
    margin&#58;0;
    margin-left&#58; 40px; padding&#58; 0;
    list-style&#58; none;
    &#125;
    .invertedshiftdown li&#123;
    display&#58; inline;
    margin&#58; 0 2px 0 0;
    padding&#58; 0;
    text-transform&#58;uppercase;
    &#125;
    .invertedshiftdown a&#123;
    float&#58; left;
    display&#58; block;
    font&#58; bold 12px Arial;
    color&#58; black;
    text-decoration&#58; none;
    margin&#58; 0 1px 0 0; padding&#58; 5px 10px 9px 10px; -moz-border-radius-bottomleft&#58; 5px;
    border-bottom-left-radius&#58; 5px;
    -moz-border-radius-bottomright&#58; 5px;
    border-bottom-right-radius&#58; 5px;
    &#125;
    .invertedshiftdown a&#58;hover&#123;
    background-color&#58; #FFCC33; padding-top&#58; 9px; padding-bottom&#58; 5px; color&#58; white;
    &#125;
    .invertedshiftdown .current a&#123; background-color&#58; #FF9900; padding-top&#58; 9px; padding-bottom&#58; 5px; color&#58; white;
    &#125;
    #myform&#123; float&#58; right;
    margin&#58; 0;
    margin-top&#58; 2px;
    padding&#58; 0;
    &#125;
    #myform .textinput&#123;
    width&#58; 190px;
    border&#58; 1px solid gray;
    &#125;
    #myform .submit&#123;
    font&#58; normal 12px Verdana;
    height&#58; 22px;
    border&#58; 1px solid #FFCC33;
    background-color&#58; black;
    color&#58; white;
    &#125;
    </style></div>
    <div style="text-align&#58; center;" class="invertedshiftdown">
    <ul>[*]Willkommen[*]Stufe 1
      <li class="current"><a
     href="http&#58;//www.ab-sofort-erfolg.de/Stufe_2.html"
     title="Stufe 2">stufe
    2</a>[*]Stufe 3[*]&uuml;ber mich[*]kontakt[/list]
    </div>
    <div style="text-align&#58; center;"><br
     style="clear&#58; both;">
    </div>
    </body>
    </html>

  6. #6
    Kaiser(in)
    Registriert seit
    24.04.2006
    Ort
    Ludwigshafen
    Beiträge
    2.720
    Danke
    0
    Bekam 0 mal "Danke" in 0 Postings

    Standard

    1. Benutze diesen Doctype, damit auch der IE6 das Boxmodell richtig interpretiert:
    Code:
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
      "http&#58;//www.w3.org/TR/html4/strict.dtd">
    2. Räume deinen head-Bereich auf:
    bisher:
    Code:
    <head>
      <style><endnote><head>
    <style><endnote><head>
    <style><endnote><head>
    <style></style>
      <title>test</title>
    
    
    </head>
    neu:
    Code:
    <head>
        <title>test</title>
    </head>
    3. Schneide deine CSS-Angaben aus und füge sie in den head-Bereich ein.
    Ändere dabei die fettmarkierten Angaben (wobei du den width-Wert noch variieren kannst):

    <head>
    <title>test</title>
    <style type="text/css">
    .invertedshiftdown{
    padding: 0;
    width: 600px;
    margin: 0 auto;

    border-top: 5px solid #D10000; background: transparent;
    voice-family: "\"}\"";
    voice-family: inherit;
    }
    .invertedshiftdown ul{
    margin:0;
    margin-left: 40px; padding: 0;
    list-style: none;
    }
    .invertedshiftdown li{
    display: inline;
    margin: 0 2px 0 0;
    padding: 0;
    text-transform:uppercase;
    }
    .invertedshiftdown a{
    float: left;
    display: block;
    font: bold 12px Arial;
    color: black;
    text-decoration: none;
    margin: 0 1px 0 0; padding: 5px 10px 9px 10px; -moz-border-radius-bottomleft: 5px;
    border-bottom-left-radius: 5px;
    -moz-border-radius-bottomright: 5px;
    border-bottom-right-radius: 5px;
    }
    .invertedshiftdown a:hover{
    background-color: #D10000; padding-top: 9px; padding-bottom: 5px; color: white;
    }
    .invertedshiftdown .current a{ background-color: #D10000; padding-top: 9px; padding-bottom: 5px; color: white;
    }
    #myform{ float: right;
    margin: 0;
    margin-top: 2px;
    padding: 0;
    }
    #myform .textinput{
    width: 190px;
    border: 1px solid gray;
    }
    #myform .submit{
    font: normal 12px Verdana;
    height: 22px;
    border: 1px solid #D10000;
    background-color: black;
    color: white;
    }
    </style>

    </head>
    4. Viel Erfolg!

  7. #7
    Samurai
    Themenstarter
    Avatar von ludgerf321
    Registriert seit
    19.11.2007
    Ort
    Hannover
    Beiträge
    232
    Danke
    0
    Bekam 0 mal "Danke" in 0 Postings

    Standard

    danke, habe das jetzt hinbekommen.

    jetzt wollte ich noch fragen, ob man nun noch 2 Balken an den Seiten machen kann die sich dem Bildschirm von der Person anpassen und bis zu dem punkt 600px zentriert gehen.
    hier noch mal zum angucken:
    www.ab-sofort-erfolg.de/test.html
    also von der mitte nach außen.

    wäre nett wenn ich auch das hinbekommen würde

  8. #8
    Kaiser(in)
    Registriert seit
    24.04.2006
    Ort
    Ludwigshafen
    Beiträge
    2.720
    Danke
    0
    Bekam 0 mal "Danke" in 0 Postings

    Standard

    Nimm bei
    Code:
    .invertedshiftdown
    den border raus.

    Füge das an der entsprechenden Stelle ein, bzw. ändere es wie folgt:
    <body>
    <div style="border-bottom: 5px solid #FF9900; background: transparent;"></div>
    <div class="invertedshiftdown">

    <ul>
    Schließlich solltest du noch den Doctype wie vorher angegeben ändern.

Ähnliche Themen

  1. inerhalb einer HTML Seite links setzten
    Von xbolten im Forum HTML & CSS Forum
    Antworten: 2
    Letzter Beitrag: 24.06.2007, 14:07
  2. Tabelle mittig positionieren
    Von nhl-hockey-king im Forum HTML & CSS Forum
    Antworten: 4
    Letzter Beitrag: 30.04.2007, 16:12
  3. [HTML] Page Mittig
    Von im Forum HTML & CSS Forum
    Antworten: 2
    Letzter Beitrag: 30.11.2005, 15:14
  4. Mittig im Frame
    Von Lollana im Forum HTML & CSS Forum
    Antworten: 2
    Letzter Beitrag: 26.05.2005, 22:08
  5. Antworten: 2
    Letzter Beitrag: 12.04.2005, 18:51

Stichworte

Berechtigungen

  • Neue Themen erstellen: Nein
  • Themen beantworten: Nein
  • Anhänge hochladen: Nein
  • Beiträge bearbeiten: Nein
  •