CSS Positionieren / Skalieren

Übersicht

Sonstiges

Smalltalk

	TimBo Betreff: CSS Positionieren / Skalieren	Mi, Nov 25, 2009 1:07 Antworten mit Zitat
Hi eine kleine Frage: wie schaffe ich es in css eine Box so zu positionieren, dass sie oben einen Abstand sagen wir 200px hat und unten einen Abstand von 25px. Ich bin schon so lange am Rätseln und komm einfach nicht drauf. Wäre nett, wenn jemand so einen Trick kennen würde. Ich möchte dor ein Frame einbinden. Mit Width=100% und Height=100% und das funktioniert nicht , wenn ich padding benutze. Liebe Grüße TimBo
mfg Tim Borowski // CPU: Ryzen 2700x GPU: Nvidia RTX 2070 OC (Gigabyte) Ram: 16GB DDR4 @ 3000MHz OS: Windows 10 Stolzer Gewinner des BCC 25 & BCC 31 hat einen ersten Preis in der 1. Runde beim BWInf 2010/2011 & 2011/12 mit BlitzBasic erreicht.

TimBo

Betreff: CSS Positionieren / Skalieren

Mi, Nov 25, 2009 1:07
Antworten mit Zitat

Hi

eine kleine Frage:
wie schaffe ich es in css eine Box so zu positionieren,
dass sie oben einen Abstand sagen wir 200px hat
und unten einen Abstand von 25px.

Ich bin schon so lange am Rätseln und komm einfach nicht drauf.

Wäre nett, wenn jemand so einen Trick kennen würde.

Ich möchte dor ein Frame einbinden. Mit Width=100% und Height=100%
und das funktioniert nicht , wenn ich padding benutze.

Liebe Grüße
TimBo

mfg Tim Borowski // CPU: Ryzen 2700x GPU: Nvidia RTX 2070 OC (Gigabyte) Ram: 16GB DDR4 @ 3000MHz OS: Windows 10
Stolzer Gewinner des BCC 25 & BCC 31
hat einen ersten Preis in der 1. Runde beim BWInf 2010/2011 & 2011/12 mit BlitzBasic erreicht.

	n-Halbleiter	Mi, Nov 25, 2009 1:10 Antworten mit Zitat
margin? Das wäre spontan das, was mir zu deinem Problem einfällt...
mfg, Calvin Maschine: Intel Core2 Duo E6750, 4GB DDR2-Ram, ATI Radeon HD4850, Win 7 x64 und Ubuntu 12.04 64-Bit Ploing! Blog "Die Seele einer jeden Ordnung ist ein großer Papierkorb." - Kurt Tucholsky (09.01.1890 - 21.12.1935)

n-Halbleiter

Mi, Nov 25, 2009 1:10
Antworten mit Zitat

margin?

Das wäre spontan das, was mir zu deinem Problem einfällt...

mfg, Calvin
Maschine: Intel Core2 Duo E6750, 4GB DDR2-Ram, ATI Radeon HD4850, Win 7 x64 und Ubuntu 12.04 64-Bit
Ploing!
Blog
"Die Seele einer jeden Ordnung ist ein großer Papierkorb." - Kurt Tucholsky (09.01.1890 - 21.12.1935)

	TimBo	Mi, Nov 25, 2009 1:13 Antworten mit Zitat
danke Leiter, nur ich weiß gerade nicht , wie mir Margin helfen soll. Margin ist doch außen um der Box. Kannst du mir ein Bespiel zeigen ? Danke nochmal TimBo
mfg Tim Borowski // CPU: Ryzen 2700x GPU: Nvidia RTX 2070 OC (Gigabyte) Ram: 16GB DDR4 @ 3000MHz OS: Windows 10 Stolzer Gewinner des BCC 25 & BCC 31 hat einen ersten Preis in der 1. Runde beim BWInf 2010/2011 & 2011/12 mit BlitzBasic erreicht.

TimBo

Mi, Nov 25, 2009 1:13
Antworten mit Zitat

danke Leiter,

nur ich weiß gerade nicht , wie mir Margin helfen soll.
Margin ist doch außen um der Box.

Kannst du mir ein Bespiel zeigen ?

Danke nochmal
TimBo

	Lion	Mi, Nov 25, 2009 1:21 Antworten mit Zitat
außen um die box ist doch, was du willst? Oder versteh ich deinen text gerad falsch? Musst dann machen... margin-top: 200px; margin-bottom: 25px;
Intel Core 2 Quad 4x2.66 ghz - 4gb ddr2 - nvidia GeForce GTX660 2gb Intel Atom 1x1.83 ghz - 2gb ddr2 - intel GMA 3150 256mb AMD A10-5750M 4x2.5 ghz - 8 gb ddr4 - AMD R9 M290x

Lion

Mi, Nov 25, 2009 1:21
Antworten mit Zitat

außen um die box ist doch, was du willst? Oder versteh ich deinen text gerad falsch?
Musst dann machen...
margin-top: 200px;
margin-bottom: 25px;

Intel Core 2 Quad 4x2.66 ghz - 4gb ddr2 - nvidia GeForce GTX660 2gb
Intel Atom 1x1.83 ghz - 2gb ddr2 - intel GMA 3150 256mb
AMD A10-5750M 4x2.5 ghz - 8 gb ddr4 - AMD R9 M290x

	n-Halbleiter	Mi, Nov 25, 2009 1:24 Antworten mit Zitat
Genau das meinte ich. Als allgemeine Referenz kann ich noch dazu raten, das HTML-Boxmodell zu verinnerlichen.
mfg, Calvin Maschine: Intel Core2 Duo E6750, 4GB DDR2-Ram, ATI Radeon HD4850, Win 7 x64 und Ubuntu 12.04 64-Bit Ploing! Blog "Die Seele einer jeden Ordnung ist ein großer Papierkorb." - Kurt Tucholsky (09.01.1890 - 21.12.1935)

n-Halbleiter

Mi, Nov 25, 2009 1:24
Antworten mit Zitat

Genau das meinte ich. Als allgemeine Referenz kann ich noch dazu raten, das HTML-Boxmodell zu verinnerlichen.

	TimBo	Mi, Nov 25, 2009 1:27 Antworten mit Zitat
ja das kenne ich schon und ich habe auch das prinzip verstanden. Aber wie muss denn jetzt die Höhe eingestellt sein ? Dass die Box wirklich sich über die komplette Höhe spannt, außer oben und unten halt den abstand lässt. Grüße TimBo
mfg Tim Borowski // CPU: Ryzen 2700x GPU: Nvidia RTX 2070 OC (Gigabyte) Ram: 16GB DDR4 @ 3000MHz OS: Windows 10 Stolzer Gewinner des BCC 25 & BCC 31 hat einen ersten Preis in der 1. Runde beim BWInf 2010/2011 & 2011/12 mit BlitzBasic erreicht.

TimBo

Mi, Nov 25, 2009 1:27
Antworten mit Zitat

ja das kenne ich schon und ich habe auch das prinzip verstanden.

Aber wie muss denn jetzt die Höhe eingestellt sein ?
Dass die Box wirklich sich über die komplette Höhe spannt,
außer oben und unten halt den abstand lässt.

Grüße
TimBo

	n-Halbleiter	Mi, Nov 25, 2009 1:32 Antworten mit Zitat
Achso, das war dein Problem, tut mir Leid, ich hatte dich falsch verstanden... Dazu fällt mir spontan keine Lösung ein, ich habe bisher immer versucht, das Problem zu umgehen, durch fixe Layouts (dann kann ich als Höhe z.B. 400px eintragen) zum Beispiel. Allerdings bin ich auch kein HTML-Guru, vielleicht fällt mir noch etwas ein, ich glaube aber, dass jemand anders eine Lösung parat hat. Es könnte natürlich auch sein, dass ich einfach aktuell zu müde bin. xD
mfg, Calvin Maschine: Intel Core2 Duo E6750, 4GB DDR2-Ram, ATI Radeon HD4850, Win 7 x64 und Ubuntu 12.04 64-Bit Ploing! Blog "Die Seele einer jeden Ordnung ist ein großer Papierkorb." - Kurt Tucholsky (09.01.1890 - 21.12.1935)

n-Halbleiter

Mi, Nov 25, 2009 1:32
Antworten mit Zitat

Achso, das war dein Problem, tut mir Leid, ich hatte dich falsch verstanden...

Dazu fällt mir spontan keine Lösung ein, ich habe bisher immer versucht, das Problem zu umgehen, durch fixe Layouts (dann kann ich als Höhe z.B. 400px eintragen) zum Beispiel. Allerdings bin ich auch kein HTML-Guru, vielleicht fällt mir noch etwas ein, ich glaube aber, dass jemand anders eine Lösung parat hat.
Es könnte natürlich auch sein, dass ich einfach aktuell zu müde bin. xD

	Lion	Mi, Nov 25, 2009 1:52 Antworten mit Zitat
also das height attribut geht bei dir nicht? Dann musst du dem elternelement vorher height zuweisen, sonst geht das nicht... mhh is spät langsam - les dir mal das hier durch http://www.gn-webdesign.de/css...t-100.html (weiß aber auch gerad nicht, in welcher form du deine "box" realisierst)
Intel Core 2 Quad 4x2.66 ghz - 4gb ddr2 - nvidia GeForce GTX660 2gb Intel Atom 1x1.83 ghz - 2gb ddr2 - intel GMA 3150 256mb AMD A10-5750M 4x2.5 ghz - 8 gb ddr4 - AMD R9 M290x

Lion

Mi, Nov 25, 2009 1:52
Antworten mit Zitat

also das height attribut geht bei dir nicht?
Dann musst du dem elternelement vorher height zuweisen, sonst geht das nicht... mhh is spät langsam - les dir mal das hier durch http://www.gn-webdesign.de/css...t-100.html (weiß aber auch gerad nicht, in welcher form du deine "box" realisierst)

Intel Core 2 Quad 4x2.66 ghz - 4gb ddr2 - nvidia GeForce GTX660 2gb
Intel Atom 1x1.83 ghz - 2gb ddr2 - intel GMA 3150 256mb
AMD A10-5750M 4x2.5 ghz - 8 gb ddr4 - AMD R9 M290x

	Jolinah	Mi, Nov 25, 2009 10:08 Antworten mit Zitat
Eine andere Möglichkeit wäre auch noch mit "position: absolute" oder fixed das Element zu platzieren. Wenn man z.b. top und bottom gleichzeitig angibt erhält es automatisch die richtige Höhe: Code: [AUSKLAPPEN] [EINKLAPPEN] #meinDiv { position: absolute; top: 200px; bottom: 25px; width: 1000px; left: 100px; } #meinIFrame { width: 100%; height: 100%; }

Jolinah

Mi, Nov 25, 2009 10:08
Antworten mit Zitat

Eine andere Möglichkeit wäre auch noch mit "position: absolute" oder fixed das Element zu platzieren. Wenn man z.b. top und bottom gleichzeitig angibt erhält es automatisch die richtige Höhe:

Code: [AUSKLAPPEN]

      #meinDiv
      {
         position: absolute;
         top: 200px;
         bottom: 25px;
         width: 1000px;
         left: 100px;
      }

      #meinIFrame
      {
         width: 100%;
         height: 100%;
      }

	TimBo	Mi, Nov 25, 2009 15:27 Antworten mit Zitat
Hi @ lion: doch heigt funktioniert bei mir , nur ich weiß nicht welchen wert ich schreiben muss , da diese ja von Bildschirm zu Bildschirm unterschiedlich sind. @Jolinah: wie sieht dazu die HTML Seite aus ? Ist die zweite Box in der ersten oder sind das seperate Boxen ? Grüße TimBo
mfg Tim Borowski // CPU: Ryzen 2700x GPU: Nvidia RTX 2070 OC (Gigabyte) Ram: 16GB DDR4 @ 3000MHz OS: Windows 10 Stolzer Gewinner des BCC 25 & BCC 31 hat einen ersten Preis in der 1. Runde beim BWInf 2010/2011 & 2011/12 mit BlitzBasic erreicht.

TimBo

Mi, Nov 25, 2009 15:27
Antworten mit Zitat

Hi

@ lion: doch heigt funktioniert bei mir , nur ich weiß nicht welchen wert ich schreiben muss , da diese ja von Bildschirm zu Bildschirm unterschiedlich sind.

@Jolinah:
wie sieht dazu die HTML Seite aus ?
Ist die zweite Box in der ersten oder sind das seperate Boxen ?

Grüße
TimBo

	Lion	Mi, Nov 25, 2009 16:06 Antworten mit Zitat
TimBo hat Folgendes geschrieben: Hi @ lion: doch heigt funktioniert bei mir , nur ich weiß nicht welchen wert ich schreiben muss , da diese ja von Bildschirm zu Bildschirm unterschiedlich sind. wie wärs mit % ?
Intel Core 2 Quad 4x2.66 ghz - 4gb ddr2 - nvidia GeForce GTX660 2gb Intel Atom 1x1.83 ghz - 2gb ddr2 - intel GMA 3150 256mb AMD A10-5750M 4x2.5 ghz - 8 gb ddr4 - AMD R9 M290x

Lion

Mi, Nov 25, 2009 16:06
Antworten mit Zitat

TimBo hat Folgendes geschrieben:

Hi

@ lion: doch heigt funktioniert bei mir , nur ich weiß nicht welchen wert ich schreiben muss , da diese ja von Bildschirm zu Bildschirm unterschiedlich sind.

wie wärs mit % ? Wink

Intel Core 2 Quad 4x2.66 ghz - 4gb ddr2 - nvidia GeForce GTX660 2gb
Intel Atom 1x1.83 ghz - 2gb ddr2 - intel GMA 3150 256mb
AMD A10-5750M 4x2.5 ghz - 8 gb ddr4 - AMD R9 M290x

	TimBo	Mi, Nov 25, 2009 16:10 Antworten mit Zitat
wie % ? ich weiß doch gar nicht wieviel % 200pixel von oben gesehen sind. Und wieviel Prozent ich zwischen 200px von oben und 25px von unten spannen kann. Ich glaube das ist unmöglich Greez TimBo
mfg Tim Borowski // CPU: Ryzen 2700x GPU: Nvidia RTX 2070 OC (Gigabyte) Ram: 16GB DDR4 @ 3000MHz OS: Windows 10 Stolzer Gewinner des BCC 25 & BCC 31 hat einen ersten Preis in der 1. Runde beim BWInf 2010/2011 & 2011/12 mit BlitzBasic erreicht.

TimBo

Mi, Nov 25, 2009 16:10
Antworten mit Zitat

wie % ?
ich weiß doch gar nicht wieviel % 200pixel von oben gesehen sind.
Und wieviel Prozent ich zwischen 200px von oben und 25px von unten spannen kann.

Ich glaube das ist unmöglich Sad

Greez
TimBo

	Jolinah	Mi, Nov 25, 2009 21:20 Antworten mit Zitat
So in etwa: Code: [AUSKLAPPEN] [EINKLAPPEN] <div id="meinDiv"> <iframe id="meinIFrame" src="datei.html" frameborder="no" /> </div> Wichtig ist auch noch der Doctype... ohne Doctype oder mit falschem Doctype wird das CSS komplett anders interpretiert (zumindest beim IE).

Jolinah

Mi, Nov 25, 2009 21:20
Antworten mit Zitat

So in etwa:

Code: [AUSKLAPPEN]

Wichtig ist auch noch der Doctype... ohne Doctype oder mit falschem Doctype wird das CSS komplett anders interpretiert (zumindest beim IE).

	Starwar	Mi, Nov 25, 2009 21:32 Antworten mit Zitat
Hilft dir das? Klick iFrames sind sehr böse. Nicht nur wegen fehlenden Komfort und Funktionalität, sondern auch wegen der Sicherheit. MFG

Starwar

Mi, Nov 25, 2009 21:32
Antworten mit Zitat

Hilft dir das?

Klick

iFrames sind sehr böse. Nicht nur wegen fehlenden Komfort und Funktionalität, sondern auch wegen der Sicherheit.

MFG

	TimBo	Mi, Nov 25, 2009 23:37 Antworten mit Zitat
dann binde ich das am besten die inhalte direkt in die eine html seite ein. Kann ich Boxen eine Scrallleiste verpassen ? mfg TimBo
mfg Tim Borowski // CPU: Ryzen 2700x GPU: Nvidia RTX 2070 OC (Gigabyte) Ram: 16GB DDR4 @ 3000MHz OS: Windows 10 Stolzer Gewinner des BCC 25 & BCC 31 hat einen ersten Preis in der 1. Runde beim BWInf 2010/2011 & 2011/12 mit BlitzBasic erreicht.

TimBo

Mi, Nov 25, 2009 23:37
Antworten mit Zitat

dann binde ich das am besten die inhalte direkt in die eine html seite ein.
Kann ich Boxen eine Scrallleiste verpassen ?

mfg
TimBo

	n-Halbleiter	Mi, Nov 25, 2009 23:39 Antworten mit Zitat
Jup, mit "overflow: scroll;" (soweit ich das weiß).
mfg, Calvin Maschine: Intel Core2 Duo E6750, 4GB DDR2-Ram, ATI Radeon HD4850, Win 7 x64 und Ubuntu 12.04 64-Bit Ploing! Blog "Die Seele einer jeden Ordnung ist ein großer Papierkorb." - Kurt Tucholsky (09.01.1890 - 21.12.1935)

n-Halbleiter

Mi, Nov 25, 2009 23:39
Antworten mit Zitat

Jup, mit "overflow: scroll;" (soweit ich das weiß).

	TimBo	Mi, Nov 25, 2009 23:44 Antworten mit Zitat
danke für das Stichwort: sehr interressant http://www.brunildo.org/test/Overflowxy2.html
mfg Tim Borowski // CPU: Ryzen 2700x GPU: Nvidia RTX 2070 OC (Gigabyte) Ram: 16GB DDR4 @ 3000MHz OS: Windows 10 Stolzer Gewinner des BCC 25 & BCC 31 hat einen ersten Preis in der 1. Runde beim BWInf 2010/2011 & 2011/12 mit BlitzBasic erreicht.

TimBo

Mi, Nov 25, 2009 23:44
Antworten mit Zitat

danke für das Stichwort:
sehr interressant
http://www.brunildo.org/test/Overflowxy2.html

Übersicht

Sonstiges

Smalltalk

Nach Oben

BlitzBasic Portal

CSS Positionieren / Skalieren

Betreff: CSS Positionieren / Skalieren