li in ul in div zentrieren

qweasd · 2. März 2009

Hallo

habe folgenden Code, wie kann ich das Menü zentrieren? Sollte eigentlich relativ simpel zu lösen sein


<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">

<html>

<head>

  <meta http-equiv="content-type" content="text/html; charset=ISO-8859-1">

  <title>test</title>

  <style type="text/css">

   <!â€“

   #dolphincontainer

   {

    position:relative;

    height:56px;

    color:#E0E0E0;

    background:#143D55;

    width:100%;

    font-family:Helvetica,Arial,Verdana,sans-serif;

   }


   #dolphinnav

   {

    position:relative;

    height:33px;

    font-size:12px;

    font-weight:bold;

    background:#fff url(images/dolphin_bg.gif) repeat-x bottom left;

    padding:0 0 0 20px;

   }


   #dolphinnav ul

   {

    margin:0;

    padding:0;

    list-style-type:none;

    width:auto;

    float:left;

   }


   #dolphinnav ul li

   {

    display:block;

    float:left;

    margin:0 1px;

   }


   #dolphinnav ul li a

   {

    display:block;

    float:left;

    color:#EAF3F8;

    text-decoration:none;

    padding:0 0 0 20px;

    height:33px;

   }


   #dolphinnav ul li a span

   {

    padding:12px 20px 0 0;

    height:21px;

    float:left;

   }


   #dolphinnav ul li a:hover

   {

    color:#fff;

    background:transparent url(images/dolphin_bg-OVER.gif) repeat-x bottom left;

   }


   #dolphinnav ul li a:hover span

   {

    display:block;

    width:auto;

    cursor:pointer;

   }


   #dolphinnav ul li a.current,#dolphinnav ul li a.current:hover

   {

    color:#fff;

    background:#1D6893 url(images/dolphin_left-ON.gif) no-repeat top left;

    line-height:275%;

   }


   #dolphinnav ul li a.current span

   {

    display:block;

    padding:0 20px 0 0;

    width:auto;

    background:#1D6893 url(images/dolphin_right-ON.gif) no-repeat top right;height:33px;

   }

   â€“>

  </style>

</head>


<body style="background-color: rgb(226, 226, 226); color: rgb(0, 0, 0);" alink="#ee0000" link="#0000ee" vlink="#551a8b">

<table style="width: 100%; text-align: center;" border="1">

  <tbody>

    <tr>

      <td>titel</td>

    </tr>

    <tr>

      <td>

       <!-- Anfang Menü -->

       <div id="dolphincontainer">

        <div id="dolphinnav">

         <ul>

          <li><a href="?action=" title=""><span>Home</span></a></li>

          <li><a href="?action=" title=""><span>About Us</span></a></li>

          <li><a href="?action=" title=""><span>Services</span></a></li>

          <li><a href="?action=" title=""><span>Our Work</span></a></li>

          <li><a href="?action=" title=""><span>Contact Us</span></a></li>

         </ul>

        </div>

       </div>

       <!-- Ende Menü -->

      </td>

    </tr>

    <tr>

      <td></td>

    </tr>

    <tr>

      <td>Content</td>

    </tr>

  </tbody>

</table>

</body>

</html>

globalnano · 2. März 2009

wieso arbeitest du denn mit table im layout? :confused:

gar nicht schön

miezi · 6. März 2009

um mich mal meinem vorredner anzuschließen: warum tables?

so ist es einfacher zu schreiben, ich weiß, aber äußerst "unsauber".

verwende stattdessen div.... und dann meinetwegen tables im div... aber bitte nicht andersrum (div im table)...

dgr243 · 6. März 2009

je nachdem was genau zentriert werden soll: sollte reichen, wenn du dem <li> oder <ul> innerhalb des dolphinvav container ein einfach ein text-align: center; mitgibst.

Anmelden

li in ul in div zentrieren

Empfohlene Beiträge

qweasd

globalnano

miezi

dgr243

Erstelle ein Benutzerkonto oder melde Dich an, um zu kommentieren

Benutzerkonto erstellen

Anmelden

Fachinformatiker Jobs

Fachinformatiker.de, 2024 by SE Internet Services

Links

Fachinformatiker.de App

Kontakt

Social media u. feeds

Jobboard für Fachinformatiker und IT-Fachkräfte

Umsehen

Aktivitäten

Stellenanzeigen

Blog

Über Fachinformatiker.de