Gå till innehåll
Just nu i M3-nätverket

Css - Centrering


mickefrisk

Rekommendera Poster

Hej.

 

Har centrerat ett lager på höjd och bredd och det ser bra ut. Men om man förminskar fönstret så halkar lagret utanför fönstret, och det betyder ju att det även hamnar utanför vid en mindre upplösning.

 

Har skrivit detta:

 

#lager1 {

margin: -285px auto auto -407px;

position:absolute;

left:50%;

top:50%;

width:816px;

height:620px;

z-index:1;

}

 

Hur ska det skrivas för att lagret aldrig ska hamna högre upp än högst upp, och aldrig mer till vänster än längst till vänster?

Länk till kommentar
Dela på andra webbplatser

Jeez.

 

I IE på mac så syns bara halva sidan på höjden.

 

What´s wrong?

 

EDIT: Det går kanske att fixa med javascript? :fundersam:

Länk till kommentar
Dela på andra webbplatser

Jag tror detta bara går att lösa med Javascript, men inte säker. Ett enkelt sådant är:

 

<script type="text/javascript"><!--

window.onresize = Pos;

 

function Pos() {

 

var wh = window.innerHeight;

var wb = window.innerWidth;

 

 

if(wh < 620) {

document.getElementById('lager1').style.top = "0px";

document.getElementById('lager1').style.height = "100%"

document.getElementById('lager1').style.marginTop = "0"

}

 

if(wh > 621 ) {

document.getElementById('lager1').style.top = "50%";

document.getElementById('lager1').style.height = "620px"

document.getElementById('lager1').style.marginTop = "-310px"

}

 

 

}

//-->

</script>

 

Nu är detta för Resize, men bör nog köras onLoad också. Har inte kollat om det funkar i IE PC, lite osäker på innerWidth och innerHeight.

Länk till kommentar
Dela på andra webbplatser

Jeez.

 

I IE på mac så syns bara halva sidan på höjden.

 

What´s wrong?

 

EDIT: Det går kanske att fixa med javascript?  :fundersam:

387026[/snapback]

 

IE mac skulle jag lämna till historien om jag vore du. :-)

 

Det är en del med CSS som inte funkar i IE Mac och därmed har den svårt att följa med standard. Och sedan tror jag att andelen som kör med den är minimal.

Länk till kommentar
Dela på andra webbplatser

Jag tror detta bara går att lösa med Javascript, men inte säker. Ett enkelt sådant är:

 

<script type="text/javascript"><!--

window.onresize = Pos;

 

function Pos() {

 

var wh = window.innerHeight;

var wb = window.innerWidth;

 

 

if(wh < 620) {

  document.getElementById('lager1').style.top = "0px";

  document.getElementById('lager1').style.height = "100%"

  document.getElementById('lager1').style.marginTop = "0"

}

 

if(wh > 621 ) {

  document.getElementById('lager1').style.top = "50%";

  document.getElementById('lager1').style.height = "620px"

  document.getElementById('lager1').style.marginTop = "-310px"

}

 

 

}

//-->

</script>

 

Nu är detta för Resize, men bör nog köras onLoad också. Har inte kollat om det funkar i IE PC, lite osäker på innerWidth och innerHeight.

387080[/snapback]

 

Funkar bra, men inte i IE på mac.

 

Tusen tack iaf, och fuck IE på mac. :bla:

 

:skondans::skondans::skondans:

Länk till kommentar
Dela på andra webbplatser

IE mac skulle jag lämna till historien om jag vore du. :-)

 

Det är en del med CSS som inte funkar i IE Mac och därmed har den svårt att följa med standard. Och sedan tror jag att andelen som kör med den är minimal.

387082[/snapback]

Jag håller med. IE för Mac var väl hyfsat bra för sisådär 5 år sedan.

Länk till kommentar
Dela på andra webbplatser

Arkiverat

Det här ämnet är nu arkiverat och är stängt för ytterligare svar.



×
×
  • Skapa nytt...