Web-Design (Browser?-)Problem bei Tabellenlayout + Iframe - Photoshop-Cafe.de :: Dein Photoshop-Forum

socke · #1 21.07.05, 16:59

Hi!
Bin jetzt auch endlich unter die Webdesigner gegangen und bastel momentan an meiner ersten Homepage.
Klappt soweit auch schon ganz gut, dank IR und Dreamweaver, nur bin ich jetzt bei nem Problem angelangt, bei dem ich als Anfänger und HTML-Lusche nimmer weiter komm.

Hab folgende 2 Seiten:

1. Die Indexseite:
http://home.arcor.de/filbiber/mayfly...iography2.html

2. Der Frame-Inhalt:
http://home.arcor.de/filbiber/mayfly...y/content.html

Im Internet Explorer funktioniert alles einwandfrei, im Firefox aber, ist der Framebereich komischerweise deutlich kleiner!
Kann sich mal jemand die Codes anschauen und mir sagen wie ich das beheben kann?

Danke schon mal! =)
Socke

Frameseite:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>Mayfly Biography Content-Frame</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
</head>

<body bgcolor="#EBE2B1">
<table align="left" border="0" width="100%" height="100%" cellspacing="25" cellpadding="0" bgcolor="#EBE2B1">
<tr>

<td align="center" valign="middle" width="100%" height="100%">
<p>
<font size="1" face="Verdana, Arial, Helvetica, sans-serif">
Wenn dieser Text angezeigt wird, funzt zumindest schon mal der Iframe! =)
<br>
<br>content.html
<br>
<br>
<br>
<br>
<br>*scroll*
</font>
</p>
</td>
</tr>
</table>
</body>
</html>

Indexseite:
<html>
<head>
<title>~ Mayfly Biography ~</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">

<script type="text/javascript">

</script>

</head>
<body bgcolor="#1D1807" leftmargin="0" topmargin="0" marginwidth="0" marginheight="0" onload="preloadImages();">
<table id="ausrichtung" width="100%" height="100%" border="0" align="center" cellpadding="0" cellspacing="0">
<tr>
<td height="100%" width="100%" valign="middle" align="center">


<table id="layout" width="700" height="550" border="0" cellpadding="0" cellspacing="0">
<tr>
<td colspan="3">
<img src="images/header.jpg" width="700" height="175" alt=""></td>
<td>
<img src="images/spacer.gif" width="1" height="175" alt=""></td>
</tr>
<tr>
<td>
<a href="#"
onmouseover="changeImages('blog', 'images/blog_over.jpg'); return true;"
onmouseout="changeImages('blog', 'images/blog.jpg'); return true;"
onmousedown="changeImages('blog', 'images/blog_over.jpg'); return true;"
onmouseup="changeImages('blog', 'images/blog_over.jpg'); return true;">
<img name="blog" src="images/blog.jpg" width="100" height="70" border="0" alt=""></a></td>
<td rowspan="8">
<table id="textfenster" border="0" cellpadding="0" cellspacing="0" height="350" width="500">
<tbody>
<tr>
<td height="350" width="500" align="center valign="middle">
<div align="center">
<iframe src="content.html" height="100%" width="100%"><font color="#C1B693" size="1" face="Verdana, Arial, Helvetica, sans-serif">Die
Seite "content.html" konnte nicht geladen werden!</font></iframe></div>
</div>
</td>
</tr>
</tbody>
</table>
</td>
<td rowspan="3">
<a href="#"
onmouseover="changeImages('musik', 'images/musik_over.jpg'); return true;"
onmouseout="changeImages('musik', 'images/musik.jpg'); return true;"
onmousedown="changeImages('musik', 'images/musik_over.jpg'); return true;"
onmouseup="changeImages('musik', 'images/musik_over.jpg'); return true;">
<img name="musik" src="images/musik.jpg" width="100" height="114" border="0" alt=""></a></td>
<td>
<img src="images/spacer.gif" width="1" height="70" alt=""></td>
</tr>
<tr>
<td>
<img src="images/menu_left.jpg" width="100" height="10" alt=""></td>
<td>
<img src="images/spacer.gif" width="1" height="10" alt=""></td>
</tr>
<tr>
<td rowspan="2">
<a href="#"
onmouseover="changeImages('steckbrief', 'images/steckbrief_over.jpg'); return true;"
onmouseout="changeImages('steckbrief', 'images/steckbrief.jpg'); return true;"
onmousedown="changeImages('steckbrief', 'images/steckbrief_over.jpg'); return true;"
onmouseup="changeImages('steckbrief', 'images/steckbrief_over.jpg'); return true;">
<img name="steckbrief" src="images/steckbrief.jpg" width="100" height="74" border="0" alt=""></a></td>
<td>
<img src="images/spacer.gif" width="1" height="34" alt=""></td>
</tr>
<tr>
<td rowspan="5">
<img src="images/menu_right.jpg" width="100" height="236" alt=""></td>
<td>
<img src="images/spacer.gif" width="1" height="40" alt=""></td>
</tr>
<tr>
<td>
<img src="images/menu_left-11.jpg" width="100" height="11" alt=""></td>
<td>
<img src="images/spacer.gif" width="1" height="11" alt=""></td>
</tr>
<tr>
<td>
<a href="#"
onmouseover="changeImages('gallerie', 'images/gallerie_over.jpg'); return true;"
onmouseout="changeImages('gallerie', 'images/gallerie.jpg'); return true;"
onmousedown="changeImages('gallerie', 'images/gallerie_over.jpg'); return true;"
onmouseup="changeImages('gallerie', 'images/gallerie_over.jpg'); return true;">
<img name="gallerie" src="images/gallerie.jpg" width="100" height="99" border="0" alt=""></a></td>
<td>
<img src="images/spacer.gif" width="1" height="99" alt=""></td>
</tr>
<tr>
<td>
<img src="images/menu_left-14.jpg" width="100" height="11" alt=""></td>
<td>
<img src="images/spacer.gif" width="1" height="11" alt=""></td>
</tr>
<tr>
<td>
<a href="#"
onmouseover="changeImages('gurke', 'images/gurke_over.jpg'); return true;"
onmouseout="changeImages('gurke', 'images/gurke.jpg'); return true;"
onmousedown="changeImages('gurke', 'images/gurke_over.jpg'); return true;"
onmouseup="changeImages('gurke', 'images/gurke_over.jpg'); return true;">
<img name="gurke" src="images/gurke.jpg" width="100" height="75" border="0" alt=""></a></td>
<td>
<img src="images/spacer.gif" width="1" height="75" alt=""></td>
</tr>
<tr>
<td colspan="3" background="images/bottom.jpg" align="center" valign="middle">
<font color="#000000" size="1" face="Verdana, Arial, Helvetica, sans-serif">© 2005 Fil</font></td>
<td>
<img src="images/spacer.gif" width="1" height="25" alt=""></td>
</tr>
</table>


</td>
</tr>
</table>

</body>
</html>

Fobby · #2 21.07.05, 17:25

Hi socke,

jap, sieht nach einem Browserproblem aus. Versuch doch mal, das <div> zu vergrößern, welches den iframe umschließt z.b.

<div style="width:100%; height:100%">

Könnte funktionieren, probier's aus

socke · #3 21.07.05, 20:27

danke für die idee, hat aber leider nicht geklappt.

muss mich wohl oder übel an CSS heranwagen, damit solls gehen.

**phoenix** · #4 21.07.05, 21:17

nimm den div mal ganz raus

um genauer testen zu können, fehlen zuviele dateien.
müsstest du mir den gesamten ordner mal übermitteln

es hat noch einige fehler im quellcode, z.b. einen </div> zuviel

leoman · #5 21.07.05, 21:37

ähm nimm doch die größen angaben der zelle

height="350" width="500" dann passt es auf jeden fall

socke · #6 21.07.05, 22:35

Zitat:

Zitat von leoman

ähm nimm doch die größen angaben der zelle

height="350" width="500" dann passt es auf jeden fall

hatte mittlerweile in allen erdenklichen tags die 500*350 verwendet, nur den div-tag selbst hab ich vergessen.

danke, zumindest hat der frame jetzt die richtige größe!

den wirren code hier nochmal zu posten erspar ich euch, solang es in dem forum hier keine anständige [code]-formatierung gibt.. *argh*

jedenfalls gabs in der zwischenzeit jetzt schon wieder ein neues problem (wiederum nur im firefox). hatte plötzlich 1-2px breite lücken zwischen den zellen der navigations-pics.
hab abgezählt und bin horizontal und vertikal auf insgesamt je 4px an lücken gekommen, woraus ich schließe, dass firefox frames standardmäßig mit einem 4px-breiteren rand als beim IE versieht. diese 4 pixel sind offenbar transparent.
hab dann einfach von der framebreite/-höhe jeweils 4 abgezogen und es hat in beiden browsern genau gepasst.

btw: kann man die hässliche graue kante vom frame nicht irgendwie ganz wegmachen?? die verhunzt den style.

achja und kann man dem scrollbalken/der scrollleiste ne andere farbe geben?

fragen über fragen...aber ich komm mit html besser zurecht als erwartet.

danke für die (folgenden *g*) antworten und viele grüße,
socke

hier nochmal der aktuelle stand

leoman · #7 21.07.05, 22:43

frameborder="0" damit ist der rahmen nicht mehr zusehn

socke · #8 21.07.05, 23:00

sorry, ich konnte meine letzten frage selbst beantworten:

<iframe src="content.html" height="350" width="500" scrolling="yes" framespacing="0" frameborder="0">

und die scrollleiste lässt sich nur mittels css formatieren.
nunja, des eilt jetzt net so..

erst mal noch design fertig machen.

hat sonst noch wer ideen, was ich z.b. specialmäßiges reinpacken könnte?

Ähnliche Themen
Thema	Autor	Forum	Antworten	Letzter Beitrag
iframe Alternative? (div?)	kasmo	Hilfestellung, Tipps und Tricks	14	01.02.11 16:48
Bilder vom Browser in PS zeiehen?	michaelxxx	Hilfestellung, Tipps und Tricks	6	16.05.09 19:45
Scrollen verbieten (im iFrame)	Lebian	Hilfestellung, Tipps und Tricks	4	16.10.06 00:58
iframe-Seite, Unterseiten auch mit kompletten iframeset anzeigbar?	Lebian	Hilfestellung, Tipps und Tricks	11	24.04.06 00:48
<iframe>?!?	S!XX	Hilfestellung, Tipps und Tricks	4	12.04.06 00:55

Aktive Benutzer in diesem Thema: 1 (Registrierte Benutzer: 0, Gäste: 1)