zurück zur Startseite
  


Zurück XHTMLforum > (X)HTML und CSS > CSS
Seite neu laden Neues layout - Probleme mit der Positionierung der Elemente

Antwort
 
LinkBack Themen-Optionen Ansicht
  #1 (permalink)  
Alt 11.07.2005, 20:48
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 19.05.2005
Beiträge: 16
MettyBirdy befindet sich auf einem aufstrebenden Ast
Standard Neues layout - Probleme mit der Positionierung der Elemente

Hallo zusammen,

als erstes möchte ich sagen dass ich noch Anfänger bin. Deswegen haut mich nicht so hart an

Als Anlage zeige ich erstmal wie meine Seite aussehen soll.
Datein als Anhang dabei.

Auf http://www.mcvnet.de/index.php?id=43 ist mein erster Versuch schonmal zu sehen.
Die Seite wird mit Typo3 gemanaged. Deswegen hier meine bisherigen Ergüsse:

die .hml Datei:

http://www.mcvnet.de/fileadmin/templ...extemplate.htm

hier meine css. Datei:
http://www.mcvnet.de/fileadmin/template-new/layout.css
Über eure Hilfe wäre ich sehr dankbar

MfG

Matthias Vogel
Angehängte Grafiken
Dateityp: png layoutmcvnet.de.png (50,1 KB, 883x aufgerufen)
Mit Zitat antworten
Sponsored Links
  #2 (permalink)  
Alt 12.07.2005, 14:09
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 19.05.2005
Beiträge: 16
MettyBirdy befindet sich auf einem aufstrebenden Ast
Standard

keiner der einem Anfänger wie mir helfen kann ?

Danke im voraus
Mit Zitat antworten
Sponsored Links
  #3 (permalink)  
Alt 12.07.2005, 14:27
{ display: random;}
XHTMLforum-Kenner
 
Registriert seit: 08.09.2004
Ort: Stuttgart
Beiträge: 5.034
andir ist ein wunderbarer Anblickandir ist ein wunderbarer Anblickandir ist ein wunderbarer Anblickandir ist ein wunderbarer Anblickandir ist ein wunderbarer Anblickandir ist ein wunderbarer Anblick
Standard

Was funktioniert nicht? Soll es so aussehen wie auf dem Bild?

Code:
.BIGIMAGE1 {
z-index:2;
position: relative;
float:left;
left:0px;
top:0px;
width:100px;
height:80px;
}
Diese divs kommen alle am Ende des Quelltexts, NACH #Inhalt und erscheinen natürlich auch da. ( pos. relative = relative zum Ort wo sie erscheinen sollen)
Wenn Du sie dann woanders positionieren willst, nimm position: absolute (ohne float)
oder bau sie gleich in #inhalt rein oder eben da, wo es passt.


Musst dann noch den Textcontainer in Inhalt evtl. anpassen
Wenn Ihr nicht gerade absolute Diddl-Fans seid, würde ich eine andere Schrift für Eure Namen wählen.... das Bild ist hübsch.

grüsse andir
__________________
Grüsse Andreas- auch mal wieder da...

Design isn't about the tools, it's about creating the best experience for the user. A design should be based on usability, accesibility, aesthetics, but never on floats, lists or background images. ( by Cameron Adams)
Wiedergelesen: > hier und hier

[Foren-Links] Dein Post? Klar, DAS vorher gelesen? Hilft. ## User-Landkarte
Mit Zitat antworten
  #4 (permalink)  
Alt 13.07.2005, 22:46
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 19.05.2005
Beiträge: 16
MettyBirdy befindet sich auf einem aufstrebenden Ast
Standard

@ all

So habe jetzt die Positionierung der Images geschaft.

Leider sind auf der Seite noch 2 Fehler. Diese sieht man am besten im Firefox ( Im IE wird einer davon nicht angezeigt !)

Der Rahmen vom Gästebuch ist nicht passend zum Text. bzw. er wird unten wieder eingeschoben.

Außer dem gibt es noch einen großen Abstand zwischen dem unteren und dem oberen Teil der Seite . Nur ist dieser nicht gewollt.

Wer kann also helfen ??

Danke im voraus
Mit Zitat antworten
  #5 (permalink)  
Alt 15.07.2005, 11:06
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 19.05.2005
Beiträge: 16
MettyBirdy befindet sich auf einem aufstrebenden Ast
Standard

@ all

Jungs Mädels ich verzweifel gerade! Keiner eine Idee ?
Mit Zitat antworten
  #6 (permalink)  
Alt 15.07.2005, 14:22
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 19.05.2005
Beiträge: 16
MettyBirdy befindet sich auf einem aufstrebenden Ast
Standard

Na wenn keiner von den Codern weiter weiß dann habe ich erst recht keine Chance.

Danke trotzdem
Mit Zitat antworten
  #7 (permalink)  
Alt 15.07.2005, 14:48
{ display: random;}
XHTMLforum-Kenner
 
Registriert seit: 08.09.2004
Ort: Stuttgart
Beiträge: 5.034
andir ist ein wunderbarer Anblickandir ist ein wunderbarer Anblickandir ist ein wunderbarer Anblickandir ist ein wunderbarer Anblickandir ist ein wunderbarer Anblickandir ist ein wunderbarer Anblick
Standard

Doch hast du.

Schmeiß den Code-Mist (ich finde ihn fürchterlich, sry) aus dem Fenster raus und fange von vorne an.
Ich habe gerade eine halbe Stunde versucht, das Ding zu entwirren und ( geschafft), dann hätt ich alles neu neu neu machen müssen. Dazu wäre eine komplette Änderung des HTML-Codes samt CSS notwendig gewesen.

Die Arbeit überlasse ich lieber dir. Soviel Zeit habe ich nicht.

Tipps: Du leidest unter Divitis ( oder typo3) Man benötigt nicht für jedes Element ein neues Div. Die divs sind ausserdem unnötig verschachtelt.
Dein Aufbau ist für meine Begriffe falsch, versuche die strukturellen Elemente ( Navi, Inhalt, Bildchen) zu erkennen und dann jeweils nur in einen Container packen - oder alle zusammen in einen oder oder...
Tipp: Navi, Inhalt und rechte Bildleiste als Container nur in einen Container packen, floaten lassen.
Die grossen Bilder ans Ende des HTML setzen, in ein div packen und mit position:absolute unter dein Trailerbildchen packen. Die Höhe der oberen Elemente ist ja fix.
clearen nicht vergessen.
Das wäre wohl die schnellste Lösung.

grüsse andir
__________________
Grüsse Andreas- auch mal wieder da...

Design isn't about the tools, it's about creating the best experience for the user. A design should be based on usability, accesibility, aesthetics, but never on floats, lists or background images. ( by Cameron Adams)
Wiedergelesen: > hier und hier

[Foren-Links] Dein Post? Klar, DAS vorher gelesen? Hilft. ## User-Landkarte
Mit Zitat antworten
  #8 (permalink)  
Alt 16.07.2005, 17:06
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 19.05.2005
Beiträge: 16
MettyBirdy befindet sich auf einem aufstrebenden Ast
Standard

@andir

Vielen dank erstmal für den Tip.

Aber wie kann man die Photos mit "absolute" setzen ohne dass sich alles verschiebt bei anderen Auflösung bzw. größen des Browsers ?

Was geht ist das ganze in % anzugeben, aber dann richtet sich er immer nach der größe der seite. Zb.B bei einem Gästebuch ist das ein Problem, dort wird die Seite ja immer größer mehr Inhalt dazu kommt.

Hast du also eine idee ???

Danke im voraus
Mit Zitat antworten
  #9 (permalink)  
Alt 16.07.2005, 17:32
Neuer Benutzer
neuer user
 
Registriert seit: 29.06.2005
Beiträge: 6
MarcoJ befindet sich auf einem aufstrebenden Ast
Standard

@MettyBirdy

Mach so wenig wie möglich Positionierung.
"Positionieren" muss man natürlich schon. Dazu braucht es aber keineswegs unbedingt ..position: absolute fixed etc...

Das ganze CSS-Zeugs zu verstehen ist am Anfang recht schwierig.
Ein Beispiel:
Code:
<ul>[*][img]bild1.jpg[/img][*][img]bild2.jpg[/img][*][img]bild3.jpg[/img][/list]
Eine simple Liste, die mit CSS nun folgendermassen formatiert werden könnte:
Code:
ul {
  background-image: bildxy.jpg;
}
li {
  float:left;
  margin-left:30px;
}
Damit hättest Du ein Bild im Hintergrund und darüberliegend 3 Bilder, die 30px Abstand zum linken Rand (des Hintergrundbildes) und untereinander haben.
Kurz gesagt: Positioniere, wenn es irgendwie geht in dem Du die einzelnen Elemente mit Margin und Padding ausrichtest.



Gruss Marco
Mit Zitat antworten
Sponsored Links
  #10 (permalink)  
Alt 16.07.2005, 21:20
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 19.05.2005
Beiträge: 16
MettyBirdy befindet sich auf einem aufstrebenden Ast
Standard

@ Marco

Vielen Dank für den Tip! aber ich lasse die einzelnen Photos dynamisch durch Typo3 einfügen. Deswegen kann ich keine Elemente in die CSS Datei einfügen. Dort wären sie wieder statisch und ich müßte sie für Änderungen von Hand bearbeiten.

Ich will quasi einen dynamischen Trailer und über diesen Trailer werden 3 Mittel große MiniPics gelegt --> waagerecht und 3 kleine MiniPics senkrecht über den Trailer gelegt.
Info: Trailer + Minipics werden dynamisch durch Typo3 erzeugt.

Über eine brauchbare Lösung würde ich mich freuen.

Danke
Mit Zitat antworten
Sponsored Links
Antwort


Forumregeln
Es ist Ihnen nicht erlaubt, neue Themen zu verfassen.
Es ist Ihnen nicht erlaubt, auf Beiträge zu antworten.
Es ist Ihnen nicht erlaubt, Anhänge hochzuladen.
Es ist Ihnen nicht erlaubt, Ihre Beiträge zu bearbeiten.

BB-Code ist an.
Smileys sind an.
[IMG] Code ist an.
HTML-Code ist aus.
Trackbacks are an
Pingbacks are an
Refbacks are aus


Ähnliche Themen
Thema Autor Forum Antworten Letzter Beitrag
Probleme mit simplen CSS Layout sidewayz CSS 1 10.07.2009 20:49
Untermenü im IE nici CSS 10 22.06.2009 21:19
Layout Probleme!!! Silverhawk1988 CSS 15 21.12.2008 15:12
3 Spalten Layout mit zentraler Positionierung freddie23 CSS 3 27.08.2007 13:11
Firefox macht Probleme im Layout. vir2a CSS 4 27.07.2007 10:22


Alle Zeitangaben in WEZ +2. Es ist jetzt 15:56 Uhr.