Probleme mit der Anzeige in verschiedenen Browsern. Bitte um Ratschläge!

gsharpp

Grünschnabel
Hallo Leute

ich versuche gerade ein altes layout welches vertikal angelegt wurde in ein horizontales layout umzugestallten. Ich hab allerdings bemerkt dass die verschiedenen Browsers die Seite anders anzeigen. FF (neues version) und IE8 scheinen die Seite fast optimal anzuzeigen, während Chrome und IE9 probleme haben. Hauptsächlich Chrome. Ich habe ein paar Screenshots angehängt. Ich hoffe ihr habt ideen. Ich glaub das problem liegt an meinem Code.

Der code für diese Seite:

Code:
/*
	DocumentEdit Page
*/
.clear
{
	overflow:hidden;
	width: 100px;
}

	
#divTagData
{
	margin-top:1cm;
	float:right;
	padding: 10px 10px 10px 10px;
	text-align:left;
	margin-right:75px;
}

#tblbuttons
{
	float:right;
	margin-left:auto;
	margin-right:55px;
	margin-top:10px;
	width:400px;
}

#divtable
{
	float: right;
	width:400px;
}

#btpadding
{ 
	padding: 0px
} 

#tblTagWrapper
{
	float:right;
	margin-left:auto;
	margin-right:auto;
	text-align:right;
}

#tblTagData
{
	float:right;
	margin-left:auto;
	margin-right:auto;
	text-align:center;
}

#txtInstructions
{
	float:right;
	clear:right;
	margin-left:auto;
	margin-right:55px;
	margin-top:10px;
	width:400px;
	height:100px;	
}

#txtInstructions.blank
{
	font-style:italic;
	color: Black;
}

#divOrderInformation
{
	margin-top:1cm;
	text-align:center;		
}

#tblOfferings
{	
	margin-left:auto;
	margin-right:55px;
	margin-bottom:10px;
	float:right;
	border-collapse:collapse;
	width: 400px;
}

#tblOfferings th
{
	font-family: Arial;
	font-size:8.5pt;
	font-weight: bold;
	background:#f8a837 url(images/buttonBack.gif) repeat-x scroll 0% 0%;
	border:solid 1px silver;
	padding:2px;
}

#tblOfferings td
{	
	font-family: Arial;
	font-size: 8.5pt;
	border:solid 1px silver;
	padding:2px;
}

#tblOfferings tr
{
	cursor:pointer;
	/* background:#add8e6 url(images/trBack.gif) repeat-x scroll 0% 0%; */
	background:#f8a837 url(images/trSelectedBack.gif) repeat-x scroll 0% 0%;
}

#tblOfferings tr.selected
{
	cursor:pointer;
	/* background:#f8a837 url(images/trSelectedBack.gif) repeat-x scroll 0% 0%; */
	background:#7da5e0 url(images/trBack.gif) repeat-x scroll 0% 0%;
}

#divPaymentOptions
{
	float:right;
}

#divProof
{
	float:left;
	padding: 20px 0px 0px 60px;
}

IMG.proof
{
	margin:5px;
	border:solid 1px black;
	height:236px;
	width:425px;
}

.space
{
	height:10px;
 

Anhänge

  • chrome.jpg
    chrome.jpg
    93,3 KB · Aufrufe: 4
  • ff.jpg
    ff.jpg
    61,9 KB · Aufrufe: 4
  • ie8.jpg
    ie8.jpg
    82,7 KB · Aufrufe: 5
Ohne den zugehörigen HTML-Code ist dein Stylesheet zur Einschätzung und Bewertung unbrauchbar.

Besser, du nennst hier den Link zu deiner Seite, damit sie direkt unter Augenschein genommen werden kann, denn niemand außer dir weiß, welche der gezeigten CSS-Regeln betroffen sind.
 
Zuletzt bearbeitet:
hier ist der HTML code zu dieser Seite

Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title>Document Preview</title>
    <script type="text/javascript" src="../js/documentedit.js?dt=20100624"></script>
       
</head>
<body>
    <div id="divContent">
        <div id="divBorder">
            <div id="divHeader">
            </div>
            <div id="divMenuBar">
            </div>
            <div id="divFrameContent">
                <span id="lblHead" class="label"></span>
                <div id="divProof" class="label" style="text-align: center;">
                </div>
                <div id="divTagData" style="display: none;">
                    <table id="tblTagWrapper" cellpadding="0" cellspacing="0">
                        <tr>
                            <td>
                                <table id="tblTagData">
                                    <tbody id="tblbTagData">
                                    </tbody>
                                </table>
                            </td>
                        </tr>
                        <tr>
                            <td style="text-align: right; padding-right: 4px;">
                                <input type="button" class="button" id="btnSaveTagData" onclick="btnSave_onClick();" />
                                <input type="button" class="button" id="btnCancelTagData" onclick="btnCancelTagData_onClick();" />
                            </td>
                        </tr>
                    </table>
                </div>
                <div id="divOrderInformation">
                    <p>
                        <span id="lblInstructions" class="label"></span>
                    </p>
                    <table id="tblOfferings">
                        <tbody id="tblbOfferings">
                        </tbody>
                    </table>
                    <div id="divtable">
                   <table id="tblbuttons" cellpadding="0" cellspacing="0">
                   <tr>
                    <td style="text-align: right; padding-right: 4px;">                       
                        <input type="button" class="button" id="btnEdit" onclick="btnEdit_onClick();"  />   
                         <input type="button" class="button" id="btnApp" onclick="btnTest_onClick();"  />                                        
                       <div id="divPaymentOptions">
                        <input type="button" class="button" id="btnOrder" onclick="btnOrder_onClick();" />                
                    </div>   
                    </td>
                     </tr> 
                     </table>          
                     </div>     
                      <p>
                        <span id="lblDocNotFound" class="label error" style="display: none;"></span>
                    </p>
                    <span id="CostCentreSpan" class="label">
                        Cost Centre: <input type="text" id="txtCostCenter" class="blank" /><br /><br />
                    </span>
                    <textarea id="txtInstructions" class="blank" onblur="txtInstructions_onBlur();" onfocus="txtInstructions_onFocus();"></textarea><br />
                </div>
                <span id="lblNoOffering" class="label error" style="display: none;"></span>
            </div>
            <div id="divFooter">
            </div>
        </div>
    </div>
</body>
</html>
 
Zurück