• Das Erstellen neuer Accounts wurde ausgesetzt. Bei berechtigtem Interesse bitte Kontaktaufnahme über die üblichen Wege. Beste Grüße der Admin

Positionieren mit CSS

Kriegr

New member
Ich möchte ein Bild und eine Tabelle in meiner include-Datei sauber positionieren und möchte das mit CSS machen. Das Problem ist nun, dass zwar die beiden Elemente richtig stehen, aber ein Rand über dem Bild bleibt, genauso hoch, also ob dort noch das Bild stünde (ohne die 'Style'-Angaben stünde ja das img über der Tabelle).

Code:
<!--INC:"menue.inc"-->
<img style="position:relative; top:50px; left:-330px" src="GRAFIKEN/KriegrNeu.gif" width="70" height="70" border="" alt="">
<table style="position:relative; top:0px; left:50px; width:650px" class="rahmen" bgcolor="#DCDCDC">....

Hab ich ein Möglichkeit diesen unwillkommenen Rand darüber zu entfernen?

[edit]
Das Problem hatte ich nicht, solange ich das img mit 'position:absolute' positioniert hatte. Blöd war dabei nur, dass sich dann die Position relativ zur Tabelle verändert hat, sobald das Fenster in der Größe verändert wurde - also habe ich es mit 'relative' probiert.
Kann ich es nicht wieder mit 'absolute' machen, ohne dass das Bild dann hin und herrutscht?
[/edit]
 
Zuletzt bearbeitet:
Hmmm nö, daran kanns nicht liegen, das sollte stimmen. Kannst du sonst schnell den Code posten? Ich kann mirs einfach nicht sehr gut vorstellen, wie das auschauen sollte...
 
Gerne!

Die Seite ist meine test-Seite und deshalb so nicht online. Kann aber mit www.steffenkuch.de/test.htm begutachtet werden. :cool:

Code:
<!doctype html public "-//W3C//DTD HTML 3.2 //EN">
<html>
<head>
<title>test</title>
<meta name="description" content="test">
<meta name="author" content="Steffen Kuch">
<meta name="keywords" content="test">
<meta name="generator" content="Ulli Meybohms HTML EDITOR">
<link rel="stylesheet" href="CSS/generell.css" type="text/css">
</head>
<body>
<center>
<!--INC:"menue.inc"-->
<img style="position:relative; top:50px; left:-330px" src="GRAFIKEN/KriegrNeu.gif" width="70" height="70" border="0" alt="">
<table style="position:relative; top:0px; left:50px; width:650px" class="rahmen" bgcolor="#DCDCDC">
<tr>
<td><a href="home.htm"><img src="GRAFIKEN/home.gif" width="30" height="30" border="0" alt="home"></a>
<img src="GRAFIKEN/spacehlg.gif" width="50" height="1" border="0" alt="">
<a href="sk.htm"><img src="GRAFIKEN/ich6.gif" width="30" height="30" border="0" alt="Lebenslauf"></a>
<a href="hobbies.htm"><img src="GRAFIKEN/hobby.gif" width="30" height="30" border="0" alt="Hobbies"></a>
<a href="books.htm"><img src="GRAFIKEN/book.gif" width="30" height="30" border="0" alt="Was ich lese"></a>
<a href="hp.htm"><img src="GRAFIKEN/website4.gif" width="30" height="30" border="0" alt="Entwicklung meiner web site"></a>
<img src="GRAFIKEN/spacehlg.gif" width="50" height="1" border="0" alt="">
<a href="http://www.boardy.de/forumdisplay.php3?forumid=45799" target="_blank"><img src="GRAFIKEN/forum3.gif" width="30" height="30" border="0" alt="Forum"></a>
<a href="http://gb.webmart.de/guestbook.cfm?bookid=290198" target="_blank"><img src="GRAFIKEN/gbuch.gif" width="30" height="30" border="0" alt="Gästebuch"></a>
<a href="http://cgi06.puretec.de/cgi-bin/fb_form?clsid=bb4a9db925d88c13d0321aa1d2339bf5" target="_blank"><img src="GRAFIKEN/feedback3.gif" width="30" height="30" border="0" alt="feedback"></a>
<img src="GRAFIKEN/spacehlg.gif" width="50" height="1" border="0" alt="">
<a href="109_spit.htm"><img src="GRAFIKEN/109spit3.gif" width="30" height="30" border="0" alt="Vergleich Bf 109 - Spitfire"></a>
<a href="filme.htm"><img src="GRAFIKEN/film3.gif" width="30" height="30" border="0" alt="Filme"></a>
<img src="GRAFIKEN/spacehlg.gif" width="50" height="1" border="0" alt="">
<a href="links.htm"><img src="GRAFIKEN/link3.gif" width="30" height="30" border="0" alt="Links"></a>
<a href="download.htm"><img src="GRAFIKEN/download3.gif" width="30" height="30" border="0" alt="Downloads"></a></td></tr></table>
<hr color="#8FBBD4" align="center" width="750" noshade size="2"><!--/INC:"menue.inc"-->
Ich hoffe, das reicht. Danke!!
 
Also, das einzig wirklich "brauchbare" das ich hingekriegt habe, ist das Bild in die Tabelle einzufügen. Aber das wird komisch dargestellt:
Code:
<center>
<!--INC:"menue.inc"-->
<table style="position:relative; top:0px; left:50px; width:650px" class="rahmen" bgcolor="#DCDCDC">
<tr>
<td><img style="position:relative; top:50px; left:-330px" src="GRAFIKEN/KriegrNeu.gif" width="70" height="70" border="0" alt="">
<a href="home.htm"><img src="GRAFIKEN/home.gif" width="30" height="30" border="0" alt="home"></a>

Dann hab ich mich bei selfhtml ein bisschen zu CSS/position belesen, aber auch nix brauchbares gefunden. Das Problem hab ich mittlerweile geschnallt :), aber mir fällt trotzdem keine andere Art, um dies über CSS zu formatieren, ein. Alternativ bleibt eine div-Formatierung, was aber sicher weniger schön wär.
 
Danke!

Danke für den Hilfeversuch!
Ich hatte auch nicht mehr Infos als das was in selfhtml stand und deshalb habe ich es jetzt ganz konservativ folgendermaßen gelöst:

Code:
<!--INC:"menue.inc"-->
<table width="750" border="0">
<tr>
 <td rowspan="2"><img src="GRAFIKEN/KriegrNeu.gif" width="70" height="70" border="0" alt=""></td>
 <td><img src="GRAFIKEN/space.gif" width="1" height="25" border="0" alt=""></td></tr>
<tr>
<td class="rahmen" bgcolor="#DCDCDC"><a href="home.htm"><img src="GRAFIKEN/home.gif" width="30" height="30" border="0" alt="home"></a>..
 
Ist die Testseite aktuell?
Dann hast du wohl schon erkannt, dass man sehr viele Anweisungen für die Positionierung ruhig mit einfachsten HTML-Mitteln machen kann. Du hast das ja auch nicht anderes gemacht als alle Bilder hintereinander weg zu schreiben.

Oder habe ich mich verguckt?
Dann spiel noch mal die Problem-Seite auf und ich will sehen was ich machen kann.
 
Guido schrieb:
Ist die Testseite aktuell?
Dann hast du wohl schon erkannt, dass man sehr viele Anweisungen für die Positionierung ruhig mit einfachsten HTML-Mitteln machen kann. Du hast das ja auch nicht anderes gemacht als alle Bilder hintereinander weg zu schreiben.

Oder habe ich mich verguckt?
Dann spiel noch mal die Problem-Seite auf und ich will sehen was ich machen kann.
Nö, du hast dich nicht verguckt! ;)

Die Testseite ist nicht ganz aktuell. Ich habe momentan keine Möglichkeit uploads zu machen.
Ich versuche eigentlich zuerst alles möglichst einfach zu machen. Falls es nicht klappt wurschtel ich solange rum, biss es klappt. Ob das dann für Opera, NS etc. passt, keine Ahnung...
 
Zurück
Oben