absolute Positionierung von Iframes

Status
Nicht offen für weitere Antworten.
aleX Angel

aleX Angel

Mitglied
Hallo Leute, ich hab jetzt grad mein neues Design fertig,

hier seht ihr den background:der Background hier

und in die 3 beigefarbenen Fenster soll jeweils 1 Iframe positioniert werden, wenn ich das mit dem padding versuche, dann verschieben sich die frames immerwieder gegenseitig und werden bei manchen pcs falsch dargestellt.
übrigens ist die site in einem 800x600 großen Popup zu sehen, also darüber brauch man sich "keine sorgen machen"...
Kann mir jemand erklären wie ich die frames positionieren muss und mit welchem code ich sie "festnieten" kann

mfg da aleXa Angel

wäre schön wenn ihr schnell antwortet, die page is nämlich schon down, un dich will sie nich soo ewig liegen lassen!
 
Hi,

für den Fall, dass das Hintergrundbild ohne Rand oben links positioniert wird, kannst Du
die iFrames mit der CSS-Eigenschaft position: absolute; positionieren. Mit top und
left können die Abstände von oben bzw. von links angegeben werden. Mit width und
height kannst Du deren Grösse festlegen.

Im nachfolgenden Beispiel habe ich die iFrames absolut positioniert. Die Beschriftungen
(main, news, index) habe ich dabei ausgespart. Sollen sie ebenfalls bedeckt sein, so
müssen die Höhenangaben um 30 Pixel gesteigert werden. Der linke iFrame müsste mit
der top-Eigenschaft zusätzlich noch um 30 Pixel nach oben verschoben werden.
HTML: 
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"
  "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title></title>
<meta name="author" content="Quaese">
<style type="text/css">
  <!--
body, html{ height: 100%;
            width: 100%;
            padding: 0;
            margin: 0;}
body{ background: url(http://people.freenet.de/mailtoheaven/background.jpg) 0 0 no-repeat;}

#frm1{ position: absolute;
       top: 390px;
       left: 63px;
       width: 200px;
       height: 115px;
       border: 0px solid red;}

#frm2{ position: absolute;
       top: 55px;
       left: 273px;
       width: 281px;
       height: 422px;
       border: 0px solid red;}

#frm3{ position: absolute;
       top: 55px;
       left: 565px;
       width: 200px;
       height: 287px;
       border: 0px solid red;}
  -->
</style>
</head>
<body>
<iframe id="frm1"></iframe>
<iframe id="frm2"></iframe>
<iframe id="frm3"></iframe>
</body>
</html>
Hoffentlich hilft Dir das weiter.

Ciao
Quaese
 
Oh du glaubst gar nicht wie sehr mir das weiterhilft... meine letzten lösungen waren doch immer sehr provisorisch und absolut mies gecoded... wenn ich mir das so anguck... perfect kann ich da nur sagen...
hab nur ein problem *schäm* bisjetzt hatte ich das ja immer so gelöst *hinzeig*

HTML: 
<p style="padding-top:0.8cm"><p style="padding-right:6.9cm">
<iframe src="startseite.htm" name="frm1" width="275" height="420" marginheight="10" marginwidth="10" align="right" frameborder="0">
<p>Ihr Browser kann leider keine eingebetteten Frames anzeigen </p>

</iframe>

is ja auch nich wirklich toll, aber so hatte ich es erreicht, dass die frameborder 0 war... hier sieht man sie ja noch, hab jetzt n bissl in deinem text probiert, aber wenn ich des angebe, dass die frameborder 0 sein soll kommt immer noch ein neues frame dazu :( ich scheine wirklich zu blöd zu sein zum coden... denn nicht das dass mein einziges Prob wäre... ich hab jetzt zwar die perfect gelegten iframes, aber krieg deren inhalt auch nemmer zugewiesen... ich muss da irgendwas falsch machen :( please, can you help me again?

vielen vielen dank für die viele mühe bis jetzt schon... (übrigens, dass die worte index, main und news ausgespart sind is so gewünscht! thx

ich geh jetz in die schule...
tschüß aleX
 
Hi,

wenn Du die iFrames wie im nachstehenden Beispiel schreibst, solltest Du keine Frameborder
mehr haben und es sollte die Seite geladen werden, die unter src angegeben wurde.
HTML: 
<iframe id="frm1" name="frame1" frameborder="0" src="index.html"></iframe>
<iframe id="frm2" name="frame2" frameborder="0" src="main.html"></iframe>
<iframe id="frm3" name="frame3" frameborder="0" src="news.html"></iframe>
Das name-Attribut kann später dazu verwendet werden, um den gewünschten iFrame
ansprechen zu können.

Ciao
Quaese
 
Vielen Dank

Hi du,

ich kann dir gar nicht sagen, wie sehr du mir geholfen hast, endlich ist der code meiner hp mal sauber... diese ganzen Versuche, das alles mit padding und solchen Spielchen zu lösen waren ja schon ziemlich mies... jetzt gefällt mir das so super! Vielen vielen Dank :)

mit freundlichen Grüßen, aleXandra
 
Status
Nicht offen für weitere Antworten.

Neue Beiträge

Zurück