• Jetzt anmelden. Es dauert nur 2 Minuten und ist kostenlos!

input neben iFrame platzieren

E

eQ RoXoN

Guest
Hi

Ich möchte eine inputbox bzw eine div links von einem iframe positionieren. Das frame ist mittels
HTML:
<div align="center">
zentriert.

Die div bzw die Inputbox soll auf der gleichen Höhe beginnen wie das iFrame selbst.

Habe schon versuch beide Elemente in ein <td> einer Tabelle zu setzen aber das hat leider auch nicht funktioniert.

Danke :)
 
Je weiter ich die Anfrage gelesen habe, um so kälter wurden die Schauer, die mir über den Rücken liefen!
Das html-Attribut align="" ist veraltet.
Vermeide unnötige <div> und wende die Eigenschaft direkt auf das Element an.
Tabellen werden nicht zu Layoutzwecken missbraucht. Sie sind nur für tabellarische Daten da.

Ich empfehle dir dringend, dich mit CSS auseinanderzusetzen.
http://www.css4you.de/
Die Antwort auf deine Frage ist das Attribut float
http://www.css4you.de/float.html
 
Hi

Danke zuerst einmal für die Antwort

Aber was spricht gegen
Code:
Align
?
Wird das in Zukunft nicht mehr supportet oder was ist falsch daran

Und was würdest du alternativ zu
Code:
<div>
Benutzten? <span>`s?

Ich probiers mal morgen aus, danke
 
CSS wurde dazu entwickelt, um Designcode vom HTML-Code zu trennen (korrigier mich jemand, wenn die Wortwahl unglücklich ist). Das erleichtert das Auffinden der Eigenschaften und macht das HTML übersichtlicher. Das ist einfach heutiger Standard (aber erst so seit 15-20 Jahren etwa o_O)und wenn man sich mal nen lauschigen Nachmittag lang damit befasst hat erübrigt sich die Frage nach dem Warum von ganz alleine ;)
Eigenschaftslose Container wie DIV oder SPAN sind Hilfsmittel und sollten nur eingesetzt werden, wenn sie wirklich gebraucht werden. Wenn du auf align="" verzichtest brauchst du prinzipiell auch das DIV nicht mehr, solange du es nicht z.B. als größeres umgebendes Element mit spezifischen Hintergrundeigenschaften benutzt.
Zum ausschließlichen Positionieren eines anderen Elemtes wird es definitiv nicht gebraucht!
Zu guter Letzt: Das Apostroph ist ein Auslassungszeichen. In einem Plural ist es extrem fehl am Platz und fühlt sich dort so unwohl, dass es dem unvorbereiteten Leser böswillig, hinterrücks und schmerzhaft ins Auge sticht.
 
Zuletzt bearbeitet:
Hallo,

jetzt wird nicht nur mein rücken nas sondern jetzt brauch ich auch eine augenbinde.

Hätte nicht nicht gedacht das html.de update gleich WEB 3.0 ist zum mitfühlen :O)

Ich habe nicht verstanden wo was nicht passt wie es soll :O).
zeige vielleicht auch mal ein link.

Cheffchen
 
Haha du alter Grammar Nazi :D

Das "http://www.roxonpro501.square7.ch/rumble/comment/?id=28&imgpath=d84e5cf43829da29a3fb0e4f13d4397f" ist die Seite auf der man die Bilder kommentieren kann. Etwas weiter unten ist ein iFrame mit border und scrolling=0, das bettet die Kommentare ein. Bei einem Klick auf mehr anzeigen ändert JS die URL. Das funktioniert soweit alles auch. Jedoch gibt es Bilder die eben auch größer oder kleiner als dieses sind. Ich möchte die beiden Textboxen fürs verfassen eines Kommentares links neben des iframe machen. Das sie im Prinzip auf der selben höhe "beginnen"

Position:absolute kann ich nicht verwenden da die Bildergröße wie gesagt dynamisch ist
 
Hallo,

so und was stört dich jetzt daran das <center> element was man nicht mehr nimmt als div zu nehmen mit einer festen breite, wo dein iframe drin ist und die Textboxen die mit float nebeneinander stehen?
Bei den Textboxen wird das ja ein formular sein da kannst das form tag nutzen um das zu floaten.
Das ist nicht größen, zeige mal was versucht hast und dann können wir sagen was besser machen kannst.

Autsch: habe gerad 2 sek den quelltext gesehen. mach erst mal grundlagen richtige wie html struktur (doctype, head, body)
3 mal HTML bereichen :O), einmal reicht. mach das erst richtig, so kann formatierung nicht klappen.

Cheffchen
 
Hallo,

so und was stört dich jetzt daran das <center> element was man nicht mehr nimmt als div zu nehmen mit einer festen breite, wo dein iframe drin ist und die Textboxen die mit float nebeneinander stehen?
Bei den Textboxen wird das ja ein formular sein da kannst das form tag nutzen um das zu floaten.
Das ist nicht größen, zeige mal was versucht hast und dann können wir sagen was besser machen kannst.

Autsch: habe gerad 2 sek den quelltext gesehen. mach erst mal grundlagen richtige wie html struktur (doctype, head, body)
3 mal HTML bereichen :O), einmal reicht. mach das erst richtig, so kann formatierung nicht klappen.

Cheffchen

Das is weil ich da zwischendrin php source habe usw. :confused: Kann mir leider grade noch nicht so viel unter deiner Lösung vorstellen könntest du mir mal ein kleines beispiel geben? Danke
 
Hi nochmal

Hat mir schonmal etwas weitergeholfen, jedoch wollte ich die Textboxen im Prinzip linksbündig und das iframe zentriert.

Sieht momentan so aus:

HTML:
<div id="mittig">
        <iframe id="cmFRM" height="500px" width="200" src="http://roxonpro501.square7.ch/rumble/embedded/?imgpath=<?php echo $imgpath; ?>&id=9" frameborder="no" scrolling="no"></iframe>
      
        <input type="text" placeholder="Please enter your Name"><br>
        <textarea placeholder="Please enter your comment"></textarea><br>              
    </div>
      
      
  
</HTML>

<style type="text/css">

#mittig {
    width:1200px;
    margin:0 auto;
    overflow: auto;
}

iframe {
    float:right;
    margin-right:10px;
}

</style>

wenn ich float auf left setze verdrängt es die Textboxen logischerweise in die nächste Zeile. So ist es rechtsbündig. Die textboxen sind allerdings so wie sie sein sollten. Gibt es nun noch eine Möglichkeit das iFrame irgendwie in die Mitte zu kriegen? Danke o_O

Edit: Link is wie gehabt: http://www.roxonpro501.square7.ch/r...d=28&imgpath=d84e5cf43829da29a3fb0e4f13d4397f :)
 
Hallo,

ne schuldige, nicht nur kopieren und so lang nicht wenigstens die grundstruktur richtig machst, macht das echt kein sin weiter zu machen.

Eine HTML datei hat so aus zu sehen, nur so: http://de.selfhtml.org/html/allgemein/grundgeruest.htm

wenn das gemacht hast können wir gerne weiter schauen.

Cheffchen

Ich verstehe ja nicht ganz was so unerlässlich an dem angeben des Dokumententyps und z.B. am angeben der Zeichenkodierung ist, da der Browser eigentlich immer alles korrekt darstellt

Hab nun trotzdem mal versucht das Dokument so aufzubauen

Danke
 
Wenn du kein korrektes HTML schreibst, dann macht auch jeder Browser, was er für richtig hält. Falls überhaupt. Je mehr Code-Fehler dein HTML hat, um so größer sind deine Chancen, dass dein CSS nicht die gewünschte Wirkung zeigt und nur Bockmist dabei rauskommt. Darum hat Cheffchen auch keine Lust dir zu helfen, solange dein Quellcode in solch chaotischem Zustand ist.
Man kann da einfach nicht vernünftig bei der gewünschten Sache helfen, ohne vorher zig Zeilen umliegenden Code zu korrigieren!
 
Wenn du kein korrektes HTML schreibst, dann macht auch jeder Browser, was er für richtig hält. Falls überhaupt. Je mehr Code-Fehler dein HTML hat, um so größer sind deine Chancen, dass dein CSS nicht die gewünschte Wirkung zeigt und nur Bockmist dabei rauskommt. Darum hat Cheffchen auch keine Lust dir zu helfen, solange dein Quellcode in solch chaotischem Zustand ist.
Man kann da einfach nicht vernünftig bei der gewünschten Sache helfen, ohne vorher zig Zeilen umliegenden Code zu korrigieren!

Habe nun versucht es noch leserlicher zu gestalten. Ist jeweils nur noch ein HTML und ein JS Abschnitt, sowie passende Tabs.

Edit: Link: http://www.roxonpro501.square7.ch/r...mgpath=d84e5cf43829da29a3fb0e4f13d4397f#input
 
Sorry, wenn ich es mal ganz deutlich sage: der HTML-Code ist immer noch ein großer Haufen Müll. Da ist es purer Zufall, wenn ein Browser überhaupt was richtig anzeigt.
Es wäre ratsam, wenn du erst mal ein vernünftiges und fehlerfreies Grundgerüst baust und dann erweiterst.
 
Hallo,
hast wenigstens angefangen ;O).

nach </HTML> kommt nichts mehr.
die blöcke die bei dir nch kommen style und javascript gehöhren im head bereich da wo nur title zu stehen hast.
das </body> was mitten in der seite hast kommt genau vor dem </HTML>.
dann ist zumindest der grund richt, aber mehr auch nicht.

Wenn das hast kannst noch mal sagen was anders möchtest nach dem stand wie das dann ist.

Cheffchen
 
Um diesem Thread mal ein Ende zu setzen, habe es nun letztendlich mit einer Tabelle gelöst. Auch wenn wohl die meisten hier wieder Brechreiz kriegen werden, hier der Code für diejenigen die das gleiche Problem haben:

HTML:
<table border="0" width="100%">  
    <tr>      
        <td width="33%">
            <!-- Linksbündiges Element --> 
        </td>      

        <td align="center" width="33%">          
            <!-- Zentriertes Element -->       
        </td>      

        <td width="33%">
            <!-- Platzhalter -->              
        </td>  
    </tr>
</table>
 
Zurück
Oben