HTML allt flyter ihop när man minimerar

Trädvy Permalänk
Medlem
Plats
Stockholm
Registrerad
Jun 2009

HTML allt flyter ihop när man minimerar

är helt ny på hemsidefronten...

i IE flyter allt ihop så fort man minimerar, dvs. ändrar strl på webbläsaren.

vad kan man göra för att det inte ska göra det??
har försökt me fixed och absolute men det gör ingen skillnad!

jag vill allstå att en bild ska finnas ute till höger, å den ska stanna därute, även om man minimerar (med andra ska man inte se den bilden om man minimerar för mycket).

hänger ni me
hehe svårt att förklara ju...

Trädvy Permalänk
Medlem
Plats
Lund
Registrerad
Apr 2007

Hej!

Finns många sätt att lösa det på.

Mitt sätt är inte mest kodoptimerat, men ifall du gör en lite mer avancerad hemsida så tjänar du på det.

Skapa en "behållare" som du placerar bilden i. Ge behållaren en class och beskriv i din css fil var du vill att behållaren ska finnas.

I htm dokumentet (i body):

<div class="bild1">
<img... />
</div>

I css dokumentet:

div{position:absolute;} //Om du vill att alla div ska vara absolute)
.bild1{width:X;height:Y;top:Z;left:Å;z-index:Ä;} //z-index och storlek är inte nödvändiga, men jag tycker att man har lite mer koll i så fall)

Lycka till!

Trädvy Permalänk
Medlem
Plats
Bromma
Registrerad
Aug 2008

Som ovan! se till att du har ett fast avstånd från vänsterkanten. Jag kör så att jag har en div som jag har all content i och den diven har en fast bredd och är centrerad i skärmen. Då minimeras inget!

Asus Striker II Extreme / XFX Geforce GTX 280 / Q9450 @ 3.6GHz/ TRUE Noctua 120/ 4x1GB Corsair TWIN3X2048-1333C9DHX / X25-M G2 80gb Velociraptor / Win 7 Ultimate x64/ Antec P190

MovieDatabase

Trädvy Permalänk
Medlem
Plats
Stockholm
Registrerad
Jun 2009

men gud... ja fattar verkligen inte...
så här ser det ut nu

HTML:
<div id="wholesidecontainer">
<div id="header">
<div id="logo"><b><br><a href="LÄNK"><img src="BILD" width="150" height="29" title="Till startsidan" /></a></b></div>
<div id="logout">LOGOUT-KNAPP</div>
</div></div>

CSS:
#wholesidecontainer
{
width: 300px;
position:absolute;
right: auto
left: 0px;
height: 500px;

}
#header
{
position:absolute;
width: 100%;
height: 61px;
background: #000066;
}
#logo
{
float: left;
width: 165px;
height: 61px;
position: fixed;
left: -8px;
top: 5px;
}
#logout
{
width: 98px;
height: 65px;
padding-top:4px;
position: fixed;
left: 705px;
top: 0px;
}