✔ Bild absolut innerhalb einer Zelle pos.?

M

Maxmods

Mitglied
Halihalo!
und schon wieder hab ich ein prob....:(

folgendes:

hab da ne Tabelle und möchte ein bild z . b über das menu legen (im Vordergrund)
nur wie geht das?

Hab mich schon auf selfhtml erkundigt - funktioniert zwar prima, aber meine tabelle ist in der mitte zentriert... also möchte ich dass das bild die tabelle als anhaltpunkt verwendet und nicht wie normal links oder rechts des Bs. - sonst verschiebt sich das Bild nicht (aber die tabelle darunter) immer wenn man das B-Fenster verkleiner/vergrößert:(

dürfte für nen Pro sicher kein Prob sein :-)

mfg MAX
 
Hi,

es gibt da leider nur einen kleinen Haken: Elemente lassen sich in Tabellenzellen nicht absolut positionieren, sprich ihre Startpositionen beziehen sich nicht auf die Grenzen innerhalb des Tabellengerüsts, sondern auf die Grenzen des Dokumentkörpers (body) bzw. Anzeigebereich des Browsers (html), was dann zu den Verschiebungen führt, sobald der Viewport skaliert wird.

mfg Maik
 
Innerhalb einer Tabellenzelle? Theoretisch ja, wenn ein paar Voraussetzungen gegeben sind :-)

Wie lautet denn der derzeitige HTML- und CSS-Code?

mfg Maik
 
Hallo,
du könntest einen relativ positionierten DIV-Block mit der erforderlichen Größe in die Zelle setzen, in dem du dann andere Elemente absolut positionieren kannst.
 
aha also du meinst ich soll den gesammten zellen inhalt in nen div packen und darin das Bild positionieren? -wie mach ich das?
 
hela hat gesagt.:
Hallo,
du könntest einen relativ positionierten DIV-Block mit der erforderlichen Größe in die Zelle setzen, in dem du dann andere Elemente absolut positionieren kannst.
Zum Vergrößern anklicken....

... der sogar schon mit #menunav existiert :)

Wenn du nun diesen (zudem invaliden) Codesnippet

Code: 
    <td height="156" colspan="3" valign="bottom" class="header">
    <img src="interface/brilletop.png" style="position:absolute; top:20px; left:1000px; z-index:100" />

    <span class="menutext">
    <div id="menunav">
                <center>
        <ul>
                        <li style="margin-left:80px;"><a href="#" target="_self" title="sample"><span>NEWS</span></a></li>
                    <li style="margin-left:20px;"><a href="#" target="_self" title="sample"><span>MODS</span></a></li>
                        <li style="margin-left:20px;"><a href="#" target="_self" title="sample"><span>GAMES</span></a></li>
                        <li style="margin-left:20px;"><a href="#" target="_self" title="sample"><span>FORUM</span></a></li>
                        <li style="margin-left:20px;"><a href="#" target="_self" title="sample"><span>OVERCLOCKING</span></a></li>
            <li style="margin-left:20px;"><a href="#" target="_self" title="sample"><span>DOWNLOADS</span></a></li>
            <li style="margin-left:20px;"><a href="#" target="_self" title="sample"><span>WEITERES</span></a></li>
                </ul>
        </center>
    </div>
</div>
   </span>    </td>

entsprechend umstellst

Code: 
<td height="156" colspan="3" valign="bottom" class="header">

    <div id="menunav" class="menutext"><img src="interface/brilletop.png" style="position:absolute; top:20px; left:1000px; z-index:100" />
                <center>
        <ul>
                        <li style="margin-left:80px;"><a href="#" target="_self" title="sample"><span>NEWS</span></a></li>
                    <li style="margin-left:20px;"><a href="#" target="_self" title="sample"><span>MODS</span></a></li>
                        <li style="margin-left:20px;"><a href="#" target="_self" title="sample"><span>GAMES</span></a></li>
                        <li style="margin-left:20px;"><a href="#" target="_self" title="sample"><span>FORUM</span></a></li>
                        <li style="margin-left:20px;"><a href="#" target="_self" title="sample"><span>OVERCLOCKING</span></a></li>
            <li style="margin-left:20px;"><a href="#" target="_self" title="sample"><span>DOWNLOADS</span></a></li>
            <li style="margin-left:20px;"><a href="#" target="_self" title="sample"><span>WEITERES</span></a></li>
                </ul>
        </center>
    </div>   </td>


wird alles Gut.

Möglicherweise ist hier noch für das Grafikelement eine Korrektur seiner beiden Startpositionen vorzunehmen.

mfg Maik
 
wow danke du alter guru!

kanst du mir auch vll. sagen wie ich es machen kann dass man durch das Trasparente durchclicken kann?
 
Überhaupt nicht, denn nun wird der Menüpunkt vom Grafikelement trotz seiner transparenten Bereiche überdeckt.

Darum hab ich mich im stillen Kämmerlein ob deines Vorhabens gewundert, ein Bild über ein Menü zu positionieren.

mfg Maik
 
Um antworten zu können musst du eingeloggt sein.

Neue Beiträge

Zurück