Site in bestimmten Feld?

**Aebian** · 10. April 2013

Also dank Photoshop PSD hab ich nun nen MacBook Air (http://industrial-destruction.de/)
Die Frage ist jezz ob es nen Code gibt damit meine gesamte Seite im Bild des Mac's bleibt.
Wenn ja, wie lautet der?

MfG

Cheppert · 10. April 2013

da musst du mit CSS arbeiten.
Am besten machst du einen DIV mit einer gewissen breite und höhe und machst den noch scrollbar

**Aebian** · 10. April 2013

Wieso scrollbar?
Das Feld soll ja eben fixx sein.
Eine Homepage in dem Bildschirm vom Mac

Cheppert · 10. April 2013

ja, aber der Inhalt sollte "IM" Bildschirm "scrollbar" sein, oder nicht?

**Aebian** · 10. April 2013

Zitat von Cheppert

ja, aber der Inhalt sollte "IM" Bildschirm "scrollbar" sein, oder nicht?

Eigentlich nicht

Sollte groß genug sein das man es lesen kann, wenn nicht kann ich ja den Mac größer machen xD

xTheTimex · 10. April 2013

Du brauchst Div's.

Die legst du dann im Stylesheet fest mit position:relative
dann nimmst du halt top: ypx; left:y2px; dann bis du dein Objekt richtig plaziert hast.

**Aebian** · 10. April 2013

Zitat von Division

Du brauchst Div's.

Die legst du dann im Stylesheet fest mit position:relative
dann nimmst du halt top: ypx; left:y2px; dann bis du dein Objekt richtig plaziert hast.

Haste nen Beispiel dafür?

Bosti · 10. April 2013

Code

#bildschirm {
position:relative;
top:abstandbild;
left:abstandbild;
}

html Teil dafür wäre dann:
<div id="bildschirm">Inhalt </div>

Alternativ könntest du das Div erstellen, über background-image den Laptop als Hintergrund setzen und anschließend via padding den Inhalt postionieren.

Hierbei könntest du dann den Abstand nach oben,unten,links rechts festlegen. Diesen misst du dir am besten in Photoshop aus.

**Aebian** · 10. April 2013

Danke dir Bosti, ich werds mal ausprobieren

xGreekz7x · 11. April 2013

So könntest du es machen

HTML

<div id="macBook">
         <div id="macContent">
                  <iframe......></iframe>
         </div>
</div>

CSS

#macBook {
         width: xpx;
         height: xpx;
         overflow: hidden;
         margin: 0 auto;
         margin-top: xpx;
}


#macContent {
         width: xpx;
         height: xpx;
         margin-top: xpx;
}

Alles anzeigen

**Aebian** · 11. April 2013

Zitat von xGreekz7x

So könntest du es machen

HTML

<div id="macBook">
         <div id="macContent">
                  <iframe......></iframe>
         </div>
</div>

CSS

#macBook {
         width: xpx;
         height: xpx;
         overflow: hidden;
         margin: 0 auto;
         margin-top: xpx;
}


#macContent {
         width: xpx;
         height: xpx;
         margin-top: xpx;
}

Alles anzeigen

Okay, Danke
Dock hab ich ja bereits
http://industrial-destruction.de/

breadfish.de 12. März 2022