CSS DIV的問題，即

-2

<!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" xml:lang="en" lang="en"> 
<head> 

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script> 
<script type="text/javascript"> 
hasVBar="";hasHBar=""; 
$(document).ready(function() { 
    if ($(document).height() > $(window).height()) { 
     hasVBar="y"; } 
    if ($(document).width() > $(window).width()) { 
     hasHBar="n"; }}); 
</script> 

<script type="text/javascript"> 
<!-- 
cUA=""; 
window.onload=function starterJobs(){ 
chkBrowser();setMidSecStart();} 

// chk browser 
function chkBrowser(){ 
if(navigator.appName=="Microsoft Internet Explorer") 
{cUA="ie";} else {cUA="oth";} 
} // ends chkBrowser() 

// starting of body matter section 
function setMidSecStart(){ 
if(cUA=="ie") 
{ 
//document.getElementById('gdMatter').style.top='150px'; 
} 
else{}} // ends chkBrowser() 
--> 
</script> 

<style type="text/css"> 
     * { 
      border:      0; 
     margin:      0; 
     padding:     0; 
     outline:     none; 
    } 
    body { 
      background-color:   #5e0305; 
     font-family:    Arial, Helvetica, sans-serif; 
     font-size:     12px; 
     color:      #999; 
     line-height:    16px; 
     } 
     #gdtrunk { 
     background:transparent url(../images/mbb.png) repeat-x; 
    } 

    .wrapper { 
     width:      1000px; 
     margin:      0 auto; 
     } 

    #topbar { 
     background:     transparent url(../images/mbb.png) repeat-x; /* menu bar base*/ 
     height:      62px; 
     overflow:     visible; 
     position:     relative; 
     z-index:     3; 
    } 

    #topbar #itmlogo { 
     float:      left; 
     list-style:     none; 
       } 

    #topbar #menuTop { 
     float:      right; 
     height:      55px; 
     background-color:   transparent; 
    } 

    #topbar ul#menuTop { 
     list-style:     none; 
    } 

    #topbar ul#menuTop li { 
     float:      left; 
     text-align:     right; 
    } 
    #topbar ul#menuTop a { 
     float:      left; 
     display:     block; 
     width:      110px; 
     height:      42px; 
     padding:     14px 7px 0px 0px; 
     text-transform:    uppercase; 
     text-decoration:   none; 
     font-weight:    bold; 
     font-size:     12px; 
     color:      #000; 
     letter-spacing:    1px; 
    } 

</style> 

</head><body> 
<div id="gdtrunk" > 
    <div class="wrapper"> 
    <div id="topbar" style="clear:both;"><a name="top"></a> 
     <div id="logobox"> 
     <ul id="itmlogo"> 
      <li><a href="http://www.e.com/"><img id="top-logo" src="./images/logo1.png" alt="eLogo" title="e Logo" width="180px"; height="198px;" /></a> </li> 
     </ul> 
      </div> 
     <div id="menubox"> 
     <ul id="menuTop"> 
      <li> 
       <a onclick="getLink('home'); return false" href="./inmaking.html" onmouseover="status=''; return true;" >home</a> 
      </li> 
     </ul> 
     </div> 
    </div> 
</div> 

<div class="wrapper" > 

<div id="gdMatter" style="background-color:#CCCCCC; position:relative; clear:both; top:10px; height:auto; padding:25px;padding-left:75px;"> 
<!-- Graphic Designing starts --> 
<div style="background-color:transparent; position:relative; top:0px; left:0px; height:300px;overflow:hidden;"> 

<div style=" position:relative; top:0px; left:0px; background:transparent; width:auto; height:10px; padding:20px 0px 20px 0px;"> 
<div style="position:relative; top:0px; left:0px; background:transparent url(butSquare1.gif) no-repeat; width:10px; height:10px; border:white solid 1px;"></div> 
<div id="printing1" style="position:relative; top:-20px; left:25px; background-color:transparent; width:auto; height:20px; padding-top:5px; margin-right:25px;">Graphic Designing </div> 
</div> 

<div style="position:relative; top:0px; left:0px; background-color:transparent;" > 
    <div id="abtgd1" style="background-color:#897656; position:relative; top:0px; left:0px;z-index:5; padding:10px 25px 20px 25px; height:225px; margin-left:0px; color:#c4baaa" class="h1text1"> 
lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum. 
    </div> 
</div><!-- abtgd123 ends --> 
</div><!-- Graphic Designing ends--> 
</div> <!-- gdMatter --> 
</div><!-- wrapper 2nd closed--> 
</div><!-- gdtrunk --> 
</body></html>

編輯由OP在評論中添加鏈接jsfiddle demo，如鏈接到的給@JapanPro's answer。CSS DIV的問題，即

來源

2010-09-25 Rahul Utb

您可以添加真實標籤並使用代碼格式工具對其進行格式化。 – 2010-09-25 03:38:12

實際的代碼，而不是一個大綱，將幫助我們幫助您找到問題所在。（尤其是*當涉及到web開發時）。 – 2010-09-25 03:38:58

如果您使用代碼標籤格式化代碼，這會很有幫助。（101）按鈕。 – jimueller 2010-09-25 03:39:06

-1

這是你的代碼實際上

<div class="div1"> 
    <div class="div2"> 
     <div class="div3" style="height:62px;"> 
      <img src="" style="height:200px;"> 
     </div> 
     <div class="div4" style="clear:both">test</div> 
    </div> 
</div>

現在的問題應該是如何在使用此代碼會給你不同的瀏覽器相同的結果，所有的瀏覽器

<div class="div1"> 
    <div class="div2"> 
     <div class="div3"> 
      <img src="" style="height:200px;display:block"> 
     </div> 
     <div class="div4">test</div> 
    </div> 
</div>

得到同樣的結果。

來源

2010-09-25 03:52:30

-1中的「div1」和「div2」，請添加評論。 – 2010-09-25 04:01:08

親愛的JapanPro，感謝您的這個提示，順便說一句，我糾正/編輯了一些後最初發布的代碼（div 3關閉b4 div4開始）。無論如何，其他人問我試着張貼實際的代碼在這裏... – 2010-09-25 04:10:09

@Rahul添加到jsfiddle.net，所以我可以看到和調整，如果需要。 – 2010-09-25 04:12:51

CSS DIV的問題，即

回答

相關問題