mediengestalter.info
FAQ :: Mitgliederliste :: MGi Team

Willkommen auf dem Portal für Mediengestalter

Aktuelles Datum und Uhrzeit: Do 25.04.2024 06:33 Benutzername: Passwort: Auto-Login

Thema: div in eine richtung unendlich vom 30.07.2009


Neues Thema eröffnen   Neue Antwort erstellen MGi Foren-Übersicht -> Allgemeines - Nonprint -> div in eine richtung unendlich
Seite: Zurück  1, 2, 3  Weiter
Autor Nachricht
zweitaccount

Dabei seit: 25.01.2008
Ort: -
Alter: -
Geschlecht: -
Verfasst Mo 10.08.2009 14:07
Titel

Antworten mit Zitat Zum Seitenanfang

InYourFace hat geschrieben:
Der Hintergrund wird noch bearbeitet, dh. es kann sein dass noch Muster hinzugefügt werden die dann durch die kleinen Lücken zwischen den aktuellen Divboxen hindurchscheinen soll - deshalb ist es auch nicht möglich zu zu mogeln und der großen Divbox beispielsweise einen Hintergrund zuzuweisen und den Streifen im background durchlaufen zu lassen.

Nimm doch ein transparentes Gif im Hintergrund (also Flächen
schwarz, Linien transparent), dann 'scheint' der Html-Bg durch?
* Keine Ahnung... *
  View user's profile Private Nachricht senden
heiko_rs

Dabei seit: 06.02.2008
Ort: Berlin
Alter: -
Geschlecht: Männlich
Verfasst Mo 10.08.2009 14:35
Titel

Antworten mit Zitat Zum Seitenanfang

Zim hat geschrieben:
width:auto; --> die Breite richtet sich dann nach dem inhalt

Nein, width: auto; ist gleichbedeutend mit gar keiner width-Deklaration. Die sog. "shrink-to-fit-width" bekommt man z.B. durch float, display: table/-table-cell, pos. abs., display: inline-block etc.

@InYourFace: Deine Heransgehensweise mit leeren Elementen ist nicht gut. Den Tipp mit der BG-Grafik hast Du bereits im Vorpost bekommen - wirf also alle leeren Elemente raus und erzeuge die Linien per BG-Grafik (für body oder ein div mit voller Breite, das Dein Wrapper-div umgibt), mit repeat-x und passender background-position.
  View user's profile Private Nachricht senden
Anzeige
Anzeige
InYourFace
Threadersteller

Dabei seit: 29.10.2007
Ort: -
Alter: -
Geschlecht: -
Verfasst Di 11.08.2009 09:16
Titel

Antworten mit Zitat Zum Seitenanfang

Danke für die Antworten, leider habe ich noch nicht alles verstanden.

Warum ist die Umsetzung mit divs die nur als Hintergrund dienen und innerhalb einer großen divbox positioniert werden, welche wiederrum mit margin zentriert wird nicht gut? Gegenüber einem größeren Bild mit transparenten Linien hoffte ich ursprünglich auf schnellere Ladezeiten.
Zweitaccount, auch wenn man das wie du beschrieben macht besteht das Problem mit den Streifen immernoch. Ich erwähnte das hauptsächlich deshalb, weil man sich ja vorstellen könnte dass man nur EINEN Streifen als Backgroundimage anlegt, welchen man durchlaufen lässt und genau so zentriert wie die große divbox. Das Problem ist dann aber, dass der schwarze Streifen in diesem Falle "durchscheinen" würde. Das ist aber nicht erwünscht, der Hintergrund soll durchscheinen. Deshalb, also weil der Hintergrund durchscheinen soll und aktuell noch nicht feststeht/variabel sein soll, kann man dem vorgeschlagenen Hintergrundgif auch keine Linien in "Hintergrundfarbe" reinmalen, was ja ansonsten des Rätsels Lösung wäre, also wenn man sich für die Lösung mit nur einem Streifen entscheidet.

Heiko_rs ich kann dir leider nicht ganz folgen. Findet die shrink-to-fit-width hier Anwendung oder war das eine allgemeine Erklärung, habe das auch nicht vollständig durchblickt? Auch den Lösungsansatz habe ich nicht richtig verstanden, vielleicht kannst du das ja nochmal ein wenig ausführlicher formulieren?
  View user's profile Private Nachricht senden
zweitaccount

Dabei seit: 25.01.2008
Ort: -
Alter: -
Geschlecht: -
Verfasst Di 11.08.2009 10:44
Titel

Antworten mit Zitat Zum Seitenanfang

Moin,
oh, das wichtigste habe ich natürlich wiedermal überlesen Grins
Da fällt mir dann auch nur noch eine fiese Konstruktion
like this hier ein (ganz grobes boxmodel):
http://zweitaccount.zw.ohost.de/bg_construction/
Wobei du dem Deppen-IE6 dann mit JavaScript beikommen
müsstest.

Grüße
  View user's profile Private Nachricht senden
InYourFace
Threadersteller

Dabei seit: 29.10.2007
Ort: -
Alter: -
Geschlecht: -
Verfasst Di 11.08.2009 11:58
Titel

Antworten mit Zitat Zum Seitenanfang

WHOW! * Ich bin unwürdig *
Genau so hatte ich mir das gedacht! Well done! Das werde ich jetzt mal auseinanderklamüsern. Wie ist das mit dem IE6 und wieso braucht man hier Javascript? Gibt es keine andere Lösung bzw was für ein Script würde benötigt werden?
  View user's profile Private Nachricht senden
zweitaccount

Dabei seit: 25.01.2008
Ort: -
Alter: -
Geschlecht: -
Verfasst Di 11.08.2009 12:21
Titel

Antworten mit Zitat Zum Seitenanfang

Naja der IE6 kennt z.B. kein min-width/min-height
da müsste man zumindest via conditional comments
schon mal heights/widths vergeben...
Code:
<!--[if lt IE 7]>
   <style type="text/css">
   DIV#crop {
      left:auto;
      bottom:auto;
      width:100%;
      height:100%;
   }
   </style>
<![endif]--

Nur hast du dann noch das Problem, dass keine Scrollbars
erscheinen bei Fenstergröße kleiner 600/400px... auf die
schnelle fällt mir da auch nix ein - außer ebend via javascript
onload/onresize schauen wie groß viewport und dann die
dimensionen des crop-elements anzupassen.
  View user's profile Private Nachricht senden
heiko_rs

Dabei seit: 06.02.2008
Ort: Berlin
Alter: -
Geschlecht: Männlich
Verfasst Di 11.08.2009 12:28
Titel

Antworten mit Zitat Zum Seitenanfang

Für eine Vertikanzentrierung (falls Du sie überhaupt brauchst) gibt es noch andere Möglichkeiten, die JS-frei sind und sogar im IE 5.0 laufen (und auch bei kleinem Viewport nichts abgeschnitten wird), z.B. http://d-graff.de/fricca/center.html

Aber die Vertikalzentr. steht erstmal auf einem anderen Blatt, die Art der Lösung hängt komplett von der Art Deines Hintergrundes ab:

InYourFace hat geschrieben:
der Hintergrund soll durchscheinen. Deshalb, also weil der Hintergrund durchscheinen soll und aktuell noch nicht feststeht/variabel sein soll

Was konkret bedeutet das? So wie auf Deiner Grafik wäre es kein Problem, aber ein Muster o.ä. würde eine andere Lösung erfordern. Erkläre also mal, was es mit dem Hintergrund auf sich hat, bzw. was da kommen kann *zwinker*

InYourFace hat geschrieben:
Findet die shrink-to-fit-width hier Anwendung oder war das eine allgemeine Erklärung

Letzteres.
  View user's profile Private Nachricht senden
InYourFace
Threadersteller

Dabei seit: 29.10.2007
Ort: -
Alter: -
Geschlecht: -
Verfasst Di 11.08.2009 12:39
Titel

Antworten mit Zitat Zum Seitenanfang

Das mit dem Hintergrund hat folgende Bewandnis: Ich würde gerne Bilder verschiedener Materialien und Strukturen verwenden, ähnlich dem Bild von zweitaccount,und diese dann regelmäßig ändern, also z.B. pro Monat ein neues Hintergrundbild verwenden. Als Produktdesigner habe ich viel mit unterschiedlichen Materialien und Oberflächenstrukturen zu tun, da bietet sich das an.

Eine Zentrierung aller Elemente horizontal, und die Zentrierung der großen Divbox, in der mein eigentlicher Content ist, in vertikal war angedacht. Die beiden Streifen, links und rechts, sollten sich hier also der Größe des Bildschirms anpassen.
Im Prinzip exakt so wie das bei der Lösung von zweitaccount funktioniert, nur am besten auch im IE6. *zwinker*
Die Zentrierung der Contentbox sowohl vertikal als auch horizontal ist nicht das Problem, das ist bei meiner aktuellen Site schon gelöst worden. Es geht um die Anpassung der Seitenstreifen an den Bildschirm des Benutzers.

Zweitaccount, ich komme nicht so recht darauf wie deine Lösung funktioniert, das mit dem croppen ist auch neu für mich, muss mich da erstmal ein wenig einlesen. Wie war das mit den Scrollbalken gemeint? Bei deiner Lösung werden in meinem Browser schon Scrollbalken angezeigt, wenn ich entsprechend minimiere.


Zuletzt bearbeitet von InYourFace am Di 11.08.2009 13:02, insgesamt 4-mal bearbeitet
  View user's profile Private Nachricht senden
 
Ähnliche Themen CSS: Horizontale Linie unendlich
[html] tabelle unendlich?
MS PowerPoint: Unendlich wechselnde Bilder
Mein Unendlich-Slider hüpft! :(
flash - zufallswiedergabe mehrerer swf soll unendlich laufen
Hilfe: Imageflow Richtung und Bugs
Neues Thema eröffnen   Neue Antwort erstellen Seite: Zurück  1, 2, 3  Weiter
MGi Foren-Übersicht -> Allgemeines - Nonprint


Du kannst keine Beiträge in dieses Forum schreiben.
Du kannst auf Beiträge in diesem Forum nicht antworten.
Du kannst an Umfragen in diesem Forum nicht mitmachen.