Closebutton an der Ecke eines Divs

Silversurfer · 7 April 2011

Hi Leute,

ich kämpfe seit geraumer Zeit mit einem Problem.
Ich möchte auf der Ecke eines Divs eine Grafik anzeigen.

Um dies zu veranschaulichen hänge ich ein Bild an - wie es aktuell ist:

Ich verwende folgendes CSS zur Positionierung:

Code:

div.closeButton {
    cursor: pointer;
    height: 30px;
    width: 30px;
    position: absolute;
    right: -15px;
    top: -15px;
}

Die Position stimm auch, aber es ist eben nur 1/4 des Buttons zu sehen.
Hab den Z-Index auch versuchsweise mal auf 1000 gestellt - nix.

Jemand ne Idee, wieso er die Ecke abschneidet?

Danke schonmal
Chris

Arcsinh · 7 April 2011

Vllt. ist deine Grafik größer als 30x30 Pixel.

Silversurfer · 7 April 2011

Arcsinh schrieb:
Vllt. ist deine Grafik größer als 30x30 Pixel.

Nein, hat genau 30x30 Pixel.

Vll. war ich nicht ganz deutlich - Der Button soll von dem Aktuellen Punkt aus über die Ecke hinaus ragen - falls es damit noch nicht klar ist, kann ich gern eine Fotomontage nachreichen :-)

mermshaus · 7 April 2011

Habe es jetzt nicht in anderen Browser getestet.

Mozilla Firefox 3.6.16

HTML:

<!DOCTYPE html>

<html lang="en">

    <head>
        <meta charset="utf-8" />
        <title>New</title>
        <style type="text/css">

div.closeButton {
    cursor: pointer;
    height: 30px;
    width: 30px;
    position: absolute;
    right: -15px;
    top: -15px;
    background: red;
}

.box {
    width: 300px;
    height: 400px;
    position: relative;
    margin: 100px;
    background: blue;
}

        </style>
    </head>

    <body>

        <div class="box">
            <div class="closeButton"></div>
        </div>

    </body>

</html>

Closebutton an der Ecke eines Divs

Silversurfer

Neues Mitglied

Arcsinh

Neues Mitglied

Silversurfer

Neues Mitglied

mermshaus

Senior HTML'ler

Neueste Beiträge