Mantenere l'immagine visualizzata correttamente quando lo zoom (HTML)

Question

Ho una pagina web con un tag form. Al di fuori del tag form (nel corpo) ho voluto impostare un'immagine di sfondo a sinistra del tag form (l'obiettivo di tale immagine di sfondo è quello di gradiente dal back-colore del corpo, che è nero al colore forma che è grigio)

Il mio problema è che quando 'zoom' il browser, (ovviamente lo zoom va verso la forma), mi aspetto che l'immagine di essere fuori dello schermo a poco a poco, ma il fatto è che l'immagine è ancora visualizzato ma va più scuro come ho ingrandire. alla fine il bordo sinistro dello schermo diventa nero. Mi sembra che l'immagine non accetta di lasciare lo schermo.

Prima Zoom in:

Dopo lo zoom:

L'immagine che viene utilizzato:

Il mio codice:

table cellspacing="0" cellpadding="0" class="myTable">
<tr>
    <td class="TopLeft">
    </td>
    <td class="Top">
    </td>
    <td class="TopRight">
    </td>
</tr>
<tr>
    <td class="Left">
    </td>
    <td>
        <table cellspacing="0" cellpadding="0">
            <tr>
                <td class="mTop" colspan="3">
                </td>
            </tr>
            <tr>
                <td class="mLeft">
                </td>
                <td class="middle">

                <form id="Form1" runat="server">

                    <div class="page">

                        <div class="main">
                            ASDFGGH
                            <asp:ContentPlaceHolder ID="MainContent" runat="server"/>                                

                        </div>
                    </div>
                </form>



                </td>
                <td class="mRight">
                </td>
            </tr>
            <tr>
                <td class="mBottom" colspan="3">
                </td>
            </tr>
        </table>
    </td>
    <td class="Right">
    </td>
</tr>
<tr>
    <td class="BottomLeft">
    </td>
    <td class="Bottom">
    </td>
    <td class="BottomRight">
    </td>
</tr>

E mi metterà solo il CSS della classe: "sinistra"

.Left
{
    width: 113px;
    height: 761px;
    background-image: url('../Images/L.jpg');    
}

Grazie ...

Answer 1

Infine ... il problema è interessato nella proprietà CSS: "background-position" che è impostato a sinistra per impostazione predefinita. Così mi sono messo

background-position: right;

E il problema è risolto

Answer 2

Non sono sicuro che questa è una domanda che può avere una risposta definitiva. Non esiste uno standard accettato per come un browser dovrebbe ingrandire una pagina. Firefox, IE e Chrome tutti lo fanno in modo diverso. Il problema è lo stesso in altri browser oltre a Firefox?

Si potrebbe anche prendere in considerazione rielaborare il codice in modo che utilizzi i div invece di tabelle per il layout della pagina, però che ci vorrà un po 'di energia. Che potrebbe tradursi in una pagina che lo zoom come ci si aspetta a.

C'è un posto dove possiamo andare a vedere tutto il codice, in modo che possiamo perderci tempo e forse più facilmente identificare una possibile soluzione?