2009-03-20 7 views
0

처음으로 여기에 질문이 있습니다.Firefox가 좋지만 IE가 아닌 테이블

나는 테이블 주위에 지은 사이트가 있는데, 좋지는 않지만 잘 수행되었다. 파이어 폭스에서는 괜찮아 보이지만 텍스트는 IE의 모든 곳에서 볼 수 있습니다.

http://www.mothershipinc.com경고 링크입니다 : 여기에 음악을

을 포함하는 인덱스 페이지에 대한 코드입니다

<?php 
include "db.php"; 

function imageResize($width, $height, $target) { 

    //takes the larger size of the width and height and applies the formula accordingly...this is so this script will work dynamically with any size image 
    if ($width > $height) { 
    $percentage = ($target/$width); 
    } else { 
    $percentage = ($target/$height); 
    } 

    //gets the new value and applies the percentage, then rounds the value 
    $width = round($width * $percentage); 
    $height = round($height * $percentage); 

    //returns the new sizes in html image tag format...this is so you can plug this function inside an image tag and just get the 
    return "width=\"$width\" height=\"50\""; 
} 

function imageResize150($width, $height, $target) { 

    //takes the larger size of the width and height and applies the formula accordingly...this is so this script will work dynamically with any size image 
    if ($width > $height) { 
    $percentage = ($target/$width); 
    } else { 
    $percentage = ($target/$height); 
    } 

    //gets the new value and applies the percentage, then rounds the value 
    $width = round($width * $percentage); 
    $height = round($height * $percentage); 

    //returns the new sizes in html image tag format...this is so you can plug this function inside an image tag and just get the 
    return "width=\"150\" height=\"$height\""; 
} 

$playerSQL = "SELECT * FROM main"; 
$playerResult = mysql_query($playerSQL) or die(mysql_error()); 
$playerRS = mysql_fetch_array($playerResult); 

?> 

<html> 
<head> 
<link rel="stylesheet" href="css/template.css" type="text/css" /> 
<?php include "fadeinscript2.php"; ?> 
<?php include "fadeinscript.php"; ?> 
</head> 
<body id="page_bg"> 
<div align="center"> 
    <table width="800" height="100%" border="0"> 
    <tr> 
    <td colspan="7" valign="bottom" align="right" height="80" background="images/header.gif" style="background-repeat:no-repeat;padding-bottom:5px;padding-right:20px;"> 
     <font style="font-size:12px;" color="#ffffff"><a href="index.php" style="text-decoration:none;font-size:12px;color:#ffffff;">Home</a> | <a href="artist.php?artistid=0" style="text-decoration:none;font-size:12px;color:#ffffff;">Artists</a></font> 
     </td> 
    </tr> 
    <tr> 
     <td colspan="7"> 
     </td> 
    </tr> 
    <tr> 
     <td colspan="7"> 
     </td> 
    </tr> 
    <tr> 
<!--BEGIN CURRENT RELEASES BLOCK--> 
     <td valign="top" width="189" height="280" background="images/small_home_box.gif" style="background-repeat:no-repeat;padding-top:8px;"> 
     <table width="100%"> 
     <tr> 
     <td align="left" colspan="2"> 
      <font style="font-size: 18px" color="#ffffff">Current Releases</h1><br /> 
     </td> 
     </tr> 
     <?php 
     $crQuery = "SELECT * FROM albums WHERE currentrelease='y' ORDER BY orderfield LIMIT 4"; 
     $crResult = mysql_query($crQuery) or die(mysql_error()); 
     while ($crRS = mysql_fetch_array($crResult)) 
     { 
      // Get Artist Name 
      $artistQuery = "SELECT * FROM artists WHERE id=" . $crRS['artistid']; 
      $artistResult = mysql_query($artistQuery) or die(mysql_error()); 
      $artistRS = mysql_fetch_array($artistResult); 
      $image_location = $crRS['image_location']; 
      echo "<tr>"; 
      echo "<td width='55' valign='top' style='padding-top:3px;'>"; 
       //Display profile image 
       //$myimage = getimagesize("albums/" . $image_location); 
       //$newsize = imageResize($myimage[0], $myimage[1], 50); 
       echo "<a href='artist.php?artistid=" . $artistRS['id'] . "' target='_self'><img src='albums/" . $image_location . "' height='50' width='50' border='0'></a>";  
      echo "</td>"; 
      echo "<td align='left' valign='top'>"; 
      echo "<font style='color:#ffffff;font-size:.7em;'>"; 
      echo "<b><a href='artist.php?artistid=" . $artistRS['id'] . "' target='_self' style='text-decoration:none;color:#ffffff;'>" . stripslashes($artistRS['artist_name']) . "</a></b><br />"; 
      echo "<a href='artist.php?artistid=" . $artistRS['id'] . "' target='_self' style='text-decoration:none;color:#ffffff;'>" . stripslashes($crRS['album_name']) . "</a>"; 
      echo "</td>"; 
      echo "</tr>"; 
     } 
     ?> 
     <tr> 
      <td colspan="2" align="right" style="font-size:.7em; color:#ffffff;padding-right:12px;"> 
      more current releases 
      </td> 
     </tr> 
     </table> 
     </td> 
<!--END CURRENT RELEASES BLOCK--> 
     <td width="25" valign="top"> 
     &nbsp; 
     </td> 
<!--BEGIN FLASH BLOCK--> 
     <td colspan="3" width="374" height="280" align="center" valign="middle" background="images/big_home_box.gif" style="background-repeat:no-repeat;padding-right:8px;"> 
      <script type="text/javascript"> 
      //new fadeshow(IMAGES_ARRAY_NAME, slideshow_width, slideshow_height, borderwidth, delay, pause (0=no, 1=yes), optionalRandomOrder) 
      new fadeshow(fadeimages, 350, 250, 0, 3000, 1, "R") 
      </script> 
     </td> 
<!--END FLASH BLOCK--> 
    <td width="10" valign="top"> 
     &nbsp; 
     </td> 
<!--BEGIN APPEARANCES BOX--> 
    <td valign="top" width="189" height="280" background="images/small_home_box.gif" style="background-repeat:no-repeat;padding-top:8px;"> 
     <table width="100%"> 
     <tr> 
     <td align="left" colspan="2"> 
      <font style="font-size: 18px" color="#ffffff">Shows</h1><br /> 
     </td> 
     </tr> 
     <?php 
     $crQuery = "SELECT * FROM appearances"; 
     $crResult = mysql_query($crQuery) or die(mysql_error()); 
     $crRS = mysql_fetch_array($crResult); 
      echo "<tr>"; 
      echo "<td width='55' valign='top' style='padding-top:3px;'>"; 
      echo "<font style='color:#ffffff;font-size:.7em;'>"; 
      echo ereg_replace("(\r\n\r\n|\n\n|\r\r)", "<br /><br />", substr($crRS['shows'],0,300)); 
      echo "</font>\n"; 
      echo "</td>"; 
      echo "</tr>"; 
     ?> 
     <tr> 
      <td colspan="2" align="right" style="font-size:.7em; color:#ffffff;padding-right:12px;"> 
      &nbsp; 
      </td> 
     </tr> 
     </table> 
     </td> 
<!--END APPEARANCES BOX--> 
    </tr> 
     <tr> 
<!--BEGIN UPCOMING RELEASES BLOCK--> 
     <td valign="top" width="189" height="367" background="images/tall_home_box.gif" style="background-repeat:no-repeat;padding-top:8px;"> 
     <table width="100%"> 
     <tr> 
     <td align="left" colspan="2"> 
      <font style="font-size: 18px" color="#ffffff">Upcoming Releases</h1><br /> 
     </td> 
     </tr> 
     <?php 
     $crQuery = "SELECT * FROM albums WHERE newrelease='y' ORDER BY orderfield LIMIT 4"; 
     $crResult = mysql_query($crQuery) or die(mysql_error()); 
     while ($crRS = mysql_fetch_array($crResult)) 
     { 
      // Get Artist Name 
      $artistQuery = "SELECT * FROM artists WHERE id=" . $crRS['artistid']; 
      $artistResult = mysql_query($artistQuery) or die(mysql_error()); 
      $artistRS = mysql_fetch_array($artistResult); 
      echo "<tr>"; 
      echo "<td width='55' valign='top' style='padding-top:3px;'>"; 
       //Display profile image 
       //$myimage = getimagesize("albums/" . $crRS['image_location']); 
       //$newsize = imageResize($myimage[0], $myimage[1], 50); 
       echo "<a href='artist.php?artistid=" . $artistRS['id'] . "' target='_blank'><img src='albums/" . $crRS['image_location'] . "' height='50' width='50' border='0'></a>";  
      echo "</td>"; 
      echo "<td align='left' valign='top'>"; 
      echo "<font style='color:#ffffff;font-size:.7em;'>"; 
      echo "<b><a href='artist.php?artistid=" . $artistRS['id'] . "' target='_blank' style='text-decoration:none;color:#ffffff;'>" . $artistRS['artist_name'] . "</a></b><br />"; 
      echo "<a href='artist.php?artistid=" . $artistRS['id'] . "' target='_blank' style='text-decoration:none;color:#ffffff;'>" . $crRS['album_name'] . "</a><br />"; 
      echo "<a href='artist.php?artistid=" . $artistRS['id'] . "' target='_blank' style='text-decoration:none;color:#ffffff;'>" . $crRS['release_date'] . "</a>"; 
      echo "</td>"; 
      echo "</tr>"; 
     } 
     ?> 
     <tr> 
      <td colspan="2" align="right" style="font-size:.7em; color:#ffffff;padding-right:12px;"> 
      &nbsp; 
      </td> 
     </tr> 
     </table> 
     </td> 
<!--END UPCOMING RELEASES BLOCK--> 
<!--BEGIN PLAYER BLOCK--> 
    <td colspan="5" valign="top" width="418" height="367"> 
     <table width="100%"> 
     <tr> 
      <td align="center"> 
      <?php 
      echo stripslashes($playerRS['playercode']); 
     ?> 
      </td> 
     </tr> 
     </table>  
    </td> 
<!--END PLAYER BLOCK--> 
<!--BEGIN NEWS BOX--> 
    <td valign="top" width="189" height="367" background="images/tall_home_box.gif" style="background-repeat:no-repeat;padding-top:8px;"> 
     <table width="100%"> 
     <tr> 
     <td align="left" colspan="2"> 
      <font style="font-size: 18px" color="#ffffff">News</h1><br /> 
     </td> 
     </tr> 
     <?php 
     $crQuery = "SELECT * FROM news"; 
     $crResult = mysql_query($crQuery) or die(mysql_error()); 
     $crRS = mysql_fetch_array($crResult); 
      echo "<tr>"; 
      echo "<td width='55' valign='top' style='padding-top:3px;'>"; 
      echo "<font style='color:#ffffff;font-size:.7em;'>"; 
      echo ereg_replace("(\r\n\r\n|\n\n|\r\r)", "<br /><br />", substr($crRS['news'],0,500)); 
      echo "</font>\n"; 
      echo "</td>"; 
      echo "</tr>"; 
     ?> 
     <tr> 
      <td colspan="2" align="right" style="font-size:.7em; color:#ffffff;padding-right:12px;"> 
      more news 
      </td> 
     </tr> 
     </table> 
     </td> 
<!--END APPEARANCES BOX--> 
    </tr> 
    <tr> 
<!--BEGIN ARTISTS BOX--> 
    <td colspan="7" width="800" height="300" align="center" valign="top" background="images/artists.gif" style="background-repeat:no-repeat;padding-top:8px; padding-right:4px; padding-left:4px;"> 
     <table width="100%"> 
     <tr> 
     <td align="left" colspan="2"> 
      <font style="font-size: 18px" color="#ffffff">Artists</font><br /> 
     </td> 
     </tr> 
     <tr> 
     <?php 
     $crQuery = "SELECT * FROM artists ORDER BY orderfield LIMIT 36"; 
     $crResult = mysql_query($crQuery) or die(mysql_error()); 
     $artists = 0; 
     $totalartists = mysql_num_rows($crResult); 
     while ($crRS = mysql_fetch_array($crResult)) 
     { 
      $artists = $artists + 1; 
      echo "<td width='100' align='center' valign='top' style='padding-top:3px;'>\n"; 
       //Display profile image 
       echo "<a href='artist.php?artistid=" . $crRS['id'] . "' target='_self'><img src='artists/" . $crRS['image_location'] . "' height='75' width='75' border='0'></a><br />\n"; 
       echo "<a href='artist.php?artistid=" . $crRS['id'] . "' target='_self' style='text-decoration:none;color:#ffffff;font-size:.7em;'>" . $crRS['artist_name'] . "</a>\n"; 
      echo "</td>\n"; 
      if($artists == 8 || $artists == 16 || $artists == 24) 
      { 
      echo "</tr>\n"; 
      echo "<tr>\n"; 
      } 
     } 
     ?> 
     </tr> 
     <tr> 
      <td colspan="6" align="right" style="font-size:.7em; color:#ffffff;padding-right:12px;"> 
      <a href="artist.php?artistid=0" style='text-decoration:none;color:#ffffff;font-size:.7em;'>more artists</a> 
      </td> 
     </tr> 
     </table>  
    </td> 
<!--END ARTISTS BOX--> 
    </tr>  
    <tr> 
     <td colspan="4" align="left" style="padding-left:15px;color:#ffffff;font-size:.75em;"> 
      Copyright &copy;2009 Mothership Inc. 
     </td> 
     <td colspan="3" align="right" style="padding-right:15px;"> 
      <a href="mailto:[email protected]" style="color:#ffffff;text-decoration:none;font-size:.75em;">Contact Us</a> 
     </td> 
    </tr> 
    </table> 
</div> 
</body> 
</html> 
+0

게시물을 수정하고 코드 태그의 모든 코드를 입력하십시오. 이런 식으로 뭔가를 이해하는 것은 다소 혼란 스럽습니다. – Alekc

+0

또한 코드 앞에 링크 태그를 닫으십시오. –

답변

2

코드의 다음 블록 생각해 볼 수 있습니다

<td valign="top" width="189" height="280" background="images/small_home_box.gif" style="background-repeat:no-repeat;padding-top:8px;"> 
     <table width="100%"> 
     <tr> 
     <td align="left" colspan="2"> 
      <font style="font-size: 18px" color="#ffffff">Shows</h1><br /> 
     </td> 
     </tr> 
     <tr><td width='55' valign='top' style='padding-top:3px;'><font style='color:#ffffff;font-size:.7em;'>PASADENA<br /><br />Mar 17 2009 8:00P 
Nabbs Creek Cafe Pasadena, Maryland <br /><br />Mar 19 2009 8:00P 
thew barn with 86 the effort Carney, Maryland <br /><br />Mar 20 2009 8:00P 
whiskey bar w/ b&b Hoboken, New Jersey <br /><br />Mar 21 2009 9:00P 
Red House Tavern w/ Bond & bentley,Tsunami Rising! Baltimore, Maryland </font> 
</td></tr> 

을 부모 td는 너비가 189이지만, 내용이있는 td는 55뿐입니다.

+0

AlekC : 텍스트를 가로로 다시 가져 오는 것이 좋습니다. 정말 고맙습니다. 이제 상자의 내용과 내용 사이에 큰 격차가 있습니다. 저를 도와 줄 수 있습니까? –

0

이것은 IE6 (내가 보았을 때)이 사용하고있는 것으로 보이는 최소 너비 태그를 지원하지 않는다는 것과 관련이 있습니다. IE6은 또한 여백과 여백을 너비로 계산하므로 말하죠. .

1

테이블 대신 분할 영역을 사용하여 레이아웃을 만드는 것이 정말 힘들지 않습니다.

다음을 염두에 두어야합니다.

IE의 이전 버전에서는 최소 너비가 지원되지 않습니다. Firefox의 너비는 테두리와 패딩을 제외합니다. IE6에서는 테두리와 패딩이 너비 내에 있습니다. 예 - 10px 패딩이있는 100px 상자는 FF가 120px이고 IE6은 100px입니다.

<div style="width: 800px; height: 80px; margin: 5px auto; background-color: Aqua;"> 
    <h2>Mothership Records Banner</h2> 
</div> 
<div style="width: 800px; margin: 10px auto; clear: both;"> 
    <div style="width: 178px; margin-right: 35px; float: left; background-color: Aqua;">Current Releases</div> 
    <div style="width: 374px; margin-right: 35px; float: left; background-color: Aqua;">Image Banner Thing</div> 
    <div style="width: 178px; float: left; background-color: Aqua;">Shows</div> 
</div> 
<div style="width: 800px; margin: 10px auto; clear: both;"> 
    <div style="width: 178px; margin-right: 35px; float: left; background-color: Aqua;">Upcoming Releases</div> 
    <div style="width: 374px; margin-right: 35px; float: left; background-color: Aqua;">Player</div> 
    <div style="width: 178px; float: left; background-color: Aqua;">News</div> 
</div> 
<div style="width: 800px; margin: 10px auto; clear: both; background-color: Aqua;"> 
    Artists 
</div> 
<div style="width: 800px; margin: 10px auto; clear: both;"> 
    Copyright 
</div> 
0
당신은 어떤 HTML 전에 엄격한 DOCTYPE을 선언함으로써 (거의) 같은 렌더링하는 대부분의 브라우저를 강제 할 수

가 출력됩니다 :

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">

없는 Doctype 때 규칙의 어떤 설정을 따르도록 브라우저에 지시 페이지의 스타일을 렌더링하고 엄격 모드 doctype은 내 경험에서 가장 큰 유사점을 가지고 있습니다.

Quirksmode은 매우 좋은 개요가 doctypes이며 그 중 comparison charts은 일급입니다.

나는 이것이 이것과 관련이 있다고 의심 스럽지만, html을 너무 망가 뜨렸다. 상자의 모든 머리글 (Current Releases, Shows, News)은 <font>Header</h1>으로 묶입니다.

관련 문제