position:absolute und wie mache ich es richtig!?

[eMazing]

Moin Ihr Lieben.
Ich mache seit ein paar Monaten meine ersten Schritte in HTML und CCS für unsere Firma. Hier überarbeite ich die Newsseite in unregelmäßigen Abständen.
Derzeit bin ich wieder dabei und mein Ergebnis bisher sieht folgendermaßen aus: Laser Plus News Seite
Mein Problem ist, dass ich einige Objekte mit position:absolute ausgerichtet habe, da ich es nicht bessere wusste. Nun sitzt mir meine Chefin im Nacken, dass es schnell fertig werden muss und ich weiß beim besten Willen nicht wie.
Durch meine position:absolute-Angaben werden Bilder wie iPad/iPod, und vorallem die Blätter(müssen grafisch noch richtig freigestellt werden) browserübergreifen nicht richtig angezeigt.
Für ein bisschen Hilfe wäre ich sehr dankbar. Im Normalfall würde ich mich da selbst durchbeisen und herausfinden wie es geht, aber da die Zeit drückt geht es diesesmal nicht anders.

 

[prm]

Du verwendest für die absoluten Positionsangaben teilweise prozentuale Werte (z.B. left: 50%). Diese wiederum sind abhängig von der jeweiligen Viewportgröße.
Da du insgesamt ein fixes Layout hast, solltest du anstelle von Prozentwerten besser Pixelangaben verwenden.

Insgesamt ist es generell besser, auf absolute Positionierungen zu verzichten und statt dessen mit float- und margin-Angaben zu arbeiten.
Oder zu positionierst ein Bezugselement relativ und setzt darein in Relation dazu ein absolut positioniertes Eelement.

 

[eMazing]

Danke für den Tipp, ich werde das gleich mal ausprobieren. Ich habe gesehen links in meiner div class news-left3 soll der Text neben dem Bild mit dem Papier als Textblock angezeigt werden. Ich hatte es mit text-indent versucht, die Zeilen, welche aktuell unter dem Bild angezeigt werden wieder rechts ein zu ordnen, jedoch war das Ergebnis war eher mangelhaft. In der aktuellen Version habe ich es wieder rausgenommen und suche nun nach einer sauberen Lösung.