opi: Link im div-Element positionieren

Hallo,

wie kann ich einen Link in einem div-Element positionieren?

.button_submit {
   width:60%;
   margin:0 auto; padding:0;
   text-align:center;
}

.button_submit a {
   display:block;
   width:104px; height:20px;
   background:url(/img/button_submit.gif);
}

.button_submit a:hover {
   background:url(/img/button_submit_hover.gif);
}

<div class="button_submit"><a href="#"></a></div>

Das Image wird leider immer linksbündig angezeigt und nicht
zentriert. Mache ich da was falsch?

Greez,
opi

--
Selfcode: ie:( fl:( br:^ va:) ls:] fo:) rl:( n4:? ss:| de:] ch:? mo:|
  1. Hi,

    .button_submit {
       width:60%;
       margin:0 auto; padding:0;

    damit zentrierst Du das DIV

    text-align:center;

    und damit dessen inline-Elemente.

    .button_submit a {
       display:block;

    jetzt ist a kein inline-Element mehr, auf das text-align Anwendung findet.

    freundliche Grüße
    Ingo

    1. Hallo Ingo,

      .button_submit a {
         display:block;
      jetzt ist a kein inline-Element mehr, auf das text-align Anwendung findet.

      ok ...

      .button_submit a {
         display:block;
         margin:0 auto;
         ...
      }

      aber da macht der IE doch Probleme, soweit ich weiss. Gibt es noch
      eine andere Alternative für mich, ausser das ich ein weiteres div-
      Element nutzen muss?

      Greez,
      opi

      --
      Selfcode: ie:( fl:( br:^ va:) ls:] fo:) rl:( n4:? ss:| de:] ch:? mo:|
      1. Hallo Ingo,

        Lösung gefunden ...

        .button_submit {
           width:60%;
           margin:0 auto; padding:0;
           width:104px; height:20px;
        }

        .button_submit a {
           width:100%; height:100%;
           display:block;
           background:url(/img/button_submit.gif);
        }

        .button_submit a:hover {
           background:url(/img/button_submit_hover.gif);
        }

        <div class="button_submit"><a href="#"></a></div>

        klappt. Danke :)

        Greez,
        opi

        --
        Selfcode: ie:( fl:( br:^ va:) ls:] fo:) rl:( n4:? ss:| de:] ch:? mo:|
      2. Hi,

        .button_submit a {
           display:block;
           margin:0 auto;
           ...
        }

        aber da macht der IE doch Probleme, soweit ich weiss. Gibt es noch
        eine andere Alternative für mich, ausser das ich ein weiteres div-
        Element nutzen muss?

        brauchst Du überhaupt dieses eine DIV?
        Und was den IE betrifft: der wendet text-align bekanntlich auch auf blocklevel-Elemente an.

        freundliche Grüße
        Ingo

        1. Hallo,

          .button_submit a {
             display:block;
             margin:0 auto;
             ...
          }

          brauchst Du überhaupt dieses eine DIV?

          natürlich. Ohne das div-Element könnte ich den Link nicht mittig
          zentrieren, da margin:0 auto; nicht mit IE funktioniert.

          Ich benötige sogar zwei DIV's.

          1. DIV 100%, center
          2. DIV Größe und Höhe des Image
          3. Link

          Und was den IE betrifft: der wendet text-align bekanntlich auch auf blocklevel-Elemente an.

          margin:0 auto; war gemeint.

          Greez,
          opi

          --
          Selfcode: ie:( fl:( br:^ va:) ls:] fo:) rl:( n4:? ss:| de:] ch:? mo:|
          1. Hi,

            brauchst Du überhaupt dieses eine DIV?

            natürlich. Ohne das div-Element könnte ich den Link nicht mittig
            zentrieren, da margin:0 auto; nicht mit IE funktioniert.

            Ich benötige sogar zwei DIV's.

            nö, zumindest sehe ich noch keinen Grund.

            1. DIV 100%, center

            body {text-align:center;}

            1. DIV Größe und Höhe des Image

            unnötig.

            1. Link

            a {display:block; width:104px; margin:auto;}

            Und was den IE betrifft: der wendet text-align bekanntlich auch auf blocklevel-Elemente an.

            margin:0 auto; war gemeint.

            ich weiß. Im standardkompatiblen Mode kann der IE6 das auch umsezten und für die übrigen Fälle hilft dann text-align.

            freundliche Grüße
            Ingo