2011-11-15 56 views
-2

在網站www.incfilms.net/news中,標題在「About」後切成兩半。除此之外,任何頁面的頁眉都不會這樣做(例如,在主頁面www.incfilms.net上)。下面的代碼,他的INC新聞網站:標題將無法正確地延伸

<!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 profile="http://gmpg.org/xfn/11"> 
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> 
<title><?php if (is_home()) { bloginfo('name'); } elseif (is_category()) { single_cat_title(); echo " - "; bloginfo('name'); } 
elseif (is_single() || is_page()) { single_post_title(); } elseif (is_search()) { bloginfo('name'); echo " search results: "; echo wp_specialchars($s); } else { wp_title('',true); } ?></title> 
<meta name="generator" content="WordPress <?php bloginfo('version'); ?>" /> <!-- leave this for stats --> 
<link rel="stylesheet" href="<?php bloginfo('stylesheet_url'); ?>" type="text/css" media="screen" /> 
<link rel="alternate" type="application/rss+xml" title="<?php bloginfo('name'); ?> RSS Feed" href="<?php bloginfo('rss2_url'); ?>" /> 
<link rel="pingback" href="<?php bloginfo('pingback_url'); ?>" /> 
<link rel="wlwmanifest" type="application/wlwmanifest+xml" href="<?php echo get_settings('home'); ?>/wp-includes/wlwmanifest.xml" /> 
<?php wp_head(); ?> 
<!--tab js--> 
<script src="<?php bloginfo('template_directory'); ?>/js/TabbedPanels.js" type="text/javascript"></script> 
<!--tab js end--> 
</head> 

<body> 
<div id="page"> 
<div id="container"> 
<!--function code--> 
     <?php 
      $feed_uri = get_option('maze_feed_uri'); 
      if(!$feed_uri or $feed_uri == '') : 
       $feed_uri = get_bloginfo('rss2_url'); 
      else : 
       $feed_uri = 'http://feeds.feedburner.com/' . $feed_uri; 
      endif; 

      $feed_email = get_option('maze_feed_id'); 
      if($feed_email or $feed_email != '') : 
       $feed_email = " or <a href='http://www.feedburner.com/fb/a/emailverifySubmit?feedId=".$feed_email."&amp;loc=en_US' target='_blank'>E-mail</a>"; 
      endif; 
     ?> 
<!--function code end--> 



<div id="topmenu"> 

<div id="feed"> 
     <a href="<?php echo $feed_uri; ?>"><?php echo (get_option('maze_feed_enable') === 'yes' ? get_option('maze_feed_count').'. ' : '');?></a> Subscribe via <a href="<?php echo $feed_uri; ?>">feed</a><?php echo $feed_email; ?>. 
</div> 

</div> 

<!--THIS IS THE CSS REFERENCE FOR THE MENU--> 
<link rel="stylesheet" href="/menu/menu_style.css" type="text/css" /> 


<!--THIS IS THE LOGO--> 
<div id="logo"> 
<img src="/index_media/l2.png" width="130" height="50" hspace="0" vspace="0" border="5"/> 
</div> 



<!--THIS IS THE MENU SYSTEM--> 
<div> 
<ul id="menu"> 
    <li><a href="/" target="_self">Home</a></li> 
    <li><a href="/rentals" target="_self">Equipment Rentals</a></li> 
    <li><a href="/services" target="_self">Production Services</a></li> 
    <li><a href="/media" target="_self">Media</a></li> 
    <li><a href="/events" target="_self">Events</a></li> 
    <li><a href="/news" target="_self">News</a></li> 
    <li><a href="/about" target="_self">About</a></li> 
</ul> 
</div> 

    <div id="header"> 
<div id="title"> 
     <h1><a href="<?php echo get_settings('home'); ?>/"><?php bloginfo('name'); ?></a></h1> 
     <h2><?php bloginfo('description'); ?></h2> 
</div> 

    </div> 

    <div id="menu"> 
     <ul> 
     <li <?php if(is_home()){echo 'class="current_page_item"';}?>><a href="<?php bloginfo('home') ?>">Home</a></li> 
     <?php wp_list_pages('title_li') ?> 
     </ul> 
    </div> 

這是我試圖在新聞網站獲得的header.php:

<html> 

<style type="text/css"> 
#header-container { 
    /* centering for IE */ 
    text-align: center; 
} 
#menu { 
    width: 950px; 
    /* undo text-align on container */ 
    text-align: center; 
    /* centering for other browsers */ 
    margin: auto; 
} 
#logo { 
    width: 950px; 
    /* undo text-align on container */ 
    text-align: left; 
    /* centering for other browsers */ 
    margin: auto; 
} 
body { 
    width: 950px; 
    /* undo text-align on container */ 
    text-align: center; 
    /* centering for other browsers */ 
    margin: auto; 
} 

</style> 



<!--THIS IS THE CSS REFERENCE FOR THE MENU--> 
<link rel="stylesheet" href="/menu/menu_style.css" type="text/css" /> 


<!--THIS IS THE LOGO--> 
<div id="logo"> 
<img src="/index_media/l2.png" width="130" height="50" hspace="0" vspace="0" border="5"/> 
</div> 



<!--THIS IS THE MENU SYSTEM--> 
<div> 
<ul id="menu"> 
    <li><a href="/" target="_self">Home</a></li> 
    <li><a href="/rentals" target="_self">Equipment Rentals</a></li> 
    <li><a href="/services" target="_self">Production Services</a></li> 
    <li><a href="/media" target="_self">Media</a></li> 
    <li><a href="/events" target="_self">Events</a></li> 
    <li><a href="/news" target="_self">News</a></li> 
    <li><a href="/about" target="_self">About</a></li> 
</ul> 
</div> 

</body> 

</html> 

謝謝大家。

回答

2

您看到的灰色區域是按鈕,並且您認爲標題「切割」本身的位置是按鈕結束的位置,而您實際上首先會看到標題。

將#menu的高度改爲33px左右,它應該可以正常工作。

+0

藉口的問題,但在那裏我會改變菜單33px? –

+0

你可以在CSS文件中做到這一點。只需在'width:950px;'下面添加'height:33px;'。 – YogevSitton

1

從#menu中刪除填充:0。

使用此

#menu { 
    background: none repeat scroll 0 0 #333333; 
    float: left; 
    list-style: none outside none; 
    margin: 0; 
    padding-left: 0; 
    padding-right: 0; 
    padding-top: 0; 
    width: 100%; 
    }