Denk-Problem

[Seban]

Huhu all,

ich bin hmm blutiger anfänger was HTML angeht und soll grad eine Homepage im Betrieb programmieren.

Ich hab ein Bild von der Homepage ohne Inhalt angehängt, damit ihr besser seht was ich meine :)

Ich habe die Homepage als Tabelle aufgebaut, da ich gemeint habe, dass dies der optimale weg wäre.

Mein Problem sind nun die drei Dreiecke unten rechts. Ich habe diese als jpg datei vorliegen, habe aber ehrlich gesagt keine Ahnung wie ich diese JPG-Datei an diese Position bringen soll. Dazu muss man auch noch sagen, dass ich die komplette Tabelle mit Prozentangaben aufgebaut habe, damit es auf jeder Auflösung einigermaßen gut anzuschauen ist.

Ich wär über jeden Vorschlag sehr dankbar.

Mit freundlichen Grüßen

Sebastian

 

[da_loki]

Ich würde dir empfehlen das mit DIVs zu machen, da dies in deinem Fall einfacher ist.

CSS:

.header {
width: 100%;
height: 250px;
background-color: black;
}

.bottom {
width: 100%;
height: 250px;
background-color: black;
position: absolute;
bottom: 0px;
}

.pfeile { // anzupassen
width: 300px;
position: absolute;
bottom: 300px;
z-index: 5;
background-image: url('pfeile.png');
background-repeat: no-repeat;
}

HTML:

<div class="header"></div>
<div class="bottom"></div>
<div class="pfeile"></div>

*ungetestet

 

[Seban]

hmm ok, ich hab das grad getestet, bin aber nicht dahinter gekommen wie ich das jpg-file an einer festen position feststicken kann.

Wenn ich nämlich das Browserfenster verkleiner, dann verschiebts alles ;)

 

[da_loki]

In dem Fall schau dir mal die Positionierung "absolute" an.
Aber beachte bei dieser Positionierung, dass andere Auflösungen die Seite dann ganz anders erleben!

CSS 4 You - The Finest in Stylesheets