Fixed bg på olika ställen i FF och IE och höjdcentrering av layout

2 svar · 400 visningar · startad av kolas 2 aug. 2005

kolasMedlem sedan mars 2001142 inlägg

Frågan2 aug. 2005 22:30#1

Två problem i samma fråga:
På min exempelfil här
Har jag en bakgrundsbild som måste ligga fixed i en scrollbox och med IE så ligger den rätt, men med FF så hamnar bakgrundsbilden inte i scrollboxen utan börjar förmodligen uppe i vänstra hörnet på skärmen, Why? hur får man till det så att det blir som i IE?

Mitt andra problem är att jag kan inte få hela tabellen (Var förresten tvungen att använda tabell för jag kan inte få till de fadade bakgrundsbilderna i kanterna enbart med CSS tyvärr) höjdcentrerad samtidigt som att sidan ska kunnna valideras som xhtml transitional.

Kod till hela eländet!

<html>
<head>
<title>Fast bakgrund</title>
<style type="text/css">
<!--
.scrollbox {
	height: 448px; 
	width: 802px;
	overflow: auto;
	background: fixed url(bg.jpg)
	}
-->
</style>
</head>
<body><table width="100%" height="100%" border="1" align="center" cellpadding="0" cellspacing="0">
 <tr>
 <td width="100%" height="100%" valign="middle">
 <!-- fusktabell for att fa tabellen centrerad i hojdled-->
 
 <table width="100%" border="1" align="center" cellpadding="0" cellspacing="0">
  <tr>
    <td>&nbsp;</td>
    <td width="802" height="50" valign="bottom">&nbsp;</td>
    <td>&nbsp;</td>
  </tr>
<tr>
    <td style="background: url(left.jpg) bottom right">&nbsp;</td>
    <td width="802" height="448">
<div class="scrollbox">
	<div id="content">Denna bakgrund ska vara fast och p&aring; samma st&auml;lle i IE och FF!</div>
</div>
	</td>
	<td style="background: url(right.jpg) bottom left">&nbsp;</td>
</tr>
  <tr>
    <td>&nbsp;</td>
    <td width="802" height="38">&nbsp;</td>
    <td>&nbsp;</td>
  </tr>
</table>

    </td>
  </tr>
</table>
</body>
</html>

TroxyMedlem sedan mars 20041 505 inlägg

2 aug. 2005 22:39#2

* Tänkte fel *

jarvkloMedlem sedan juli 20013 378 inlägg

3 aug. 2005 07:20#3

Background-attachment:

Det är MSIE som gör fel här... Du måste positionera om bakgrundsbilden relativt övre vänstra hörnet för att det skall funka "enligt standard"

Eric Meyer skrev:

Despite some claims to the contrary, IE6/Win's rendering of this page is not correct, as it (as well as some other browsers) doesn't correctly support background-attachment: fixed for any element other than the body.

Eric Meyer skrev:

According to CSS, any background image that is "fixed" using background-attachment: fixed; is fixed with respect to the viewport-- not the element with which the image is associated.

Källa: http://meyerweb.com/eric/css/edge/complexspiral/demo.html

Formell källa: http://www.w3.org/TR/CSS21/colors.html#propdef-background-attachment

Ställ in height med style="height:..." istället... (det finns inga "height"-attribut för tabeller och tabellceller - varken i HTML4 eller XHTML - Att det funkar ändå beror på att "height" är en "allmänt accepterad" webbläsarutvidgning på så sätt att "alla" fabrikanter infört det fast det inte finns i "standard" ) ;)