css排除浏览器版本问题 [英] css troubleshooting browser versions

问题描述

嘿所有，

i有代码片段代表左侧导航菜单

由asp.net 1.1中的样式表装饰


它在ie6中正常工作，但在ie7和firefox中不正确。我有一个

视频链接下面的问题（视频不能在ie7工作对不起，不知道为什么）

无论如何，代码也在下面。请花一点时间看视频

其余部分仅供参考。

http://www25.brinkster.com/rodchar/medtest.htm


... 。


CSS样式表：

正文

{

}

..td-home-vertmenu

{

宽度：141px;

}

..td- home-vertmenu a：link，.td-home-vertmenu a：visited，.td-home-vertmenu

a：active，.td-custom-home-vertmenu a：link，.td-custom -home-vertmenu

a：visited，.td-custom-home-vertmenu a：active

{

margin-top：2px;

padding-right：2px;

margin-bottom：3px;

padding-left：2px;

字体-weight：bold;

font-size：x-small;

background-attachment：fixed;

background-image：url（图片/VertMenuBackground.jpg）;

宽度：141px;

颜色：白色;

background-repeat：no-repeat;

font-family：Arial;

身高：23px;

text-decoration ：无;

}

..td-home-vertmenu a：hover，.td-custom-home-vertmenu a：hover

{

margin-top：2px;

padding-right：2px;

padding-left：2px;

font-weight：bold;

font-size：x-small;

background-attachment：fixed;

background-image：url （Images / VertMenuHoverBackground.jpg）;

margin-bottom：3px;

宽度：141px;

颜色：＃4b0082;

background-repeat：no-repeat;

font-family：Arial;

身高：23px;

text-decoration ：无;

}


Html代码：


< table>

< tr>

< TD class =" td-home-vertmenu" vAlign =" top">

< span id =" HomeVerticalMenuControl1">< a

href =" /www.test.edu/Administration /">管理< / a>

< a href =" /www.test.edu/Admissions/">招生< / a< a

href =" /www.test.edu/Early+Admission/">

提前入场< / a< a href =" /www.test.edu/Campus+Life /">校园

生活< / a< a href =" /www.test.edu/test+Athletics/">

test Athletics< / a< A title =" Blackboard Link"

href =" http://blackboard.test.edu/" target =" _blank">

Blackboard< / A>< A title =" test Net Link"

href =" http：// jenwebnew。 test.edu/ics/?" target =" _blank"> test

Net< / A>< A title =" Title III Link"

href =" /www.test。 edu / TitleIII.htm"> Title III< / A>< A title =" Alumni Link"

href =" /www.test.edu/Alumni.htm"> Alumni< ; / A>< A title =" Bookstore Link"

href =" /www.test.edu/Bookstore.htm"> Bookstore< / A>< BR>

< A title =" Current Students Link"

href =" http：//jenwebnew.test.edu/exweb/" target =" _blank">

当前学生< / A>< BR>

< BR>

< BR>

< / span>

< / TD>

< / tr>

< /表>

hey all,
i have snippet of code which represents a left-side navigation menu
decorated by a stylesheet all in asp.net 1.1

it works correctly in ie6, but incorrectly in ie7 and firefox. i have a
video link below of the problem (video won''t work in ie7 sorry, not sure why)
Anyway, the code is below also. Please take a moment to see the video the
rest of this is just for reference only.

http://www25.brinkster.com/rodchar/medtest.htm

....

CSS StyleSheet:
body
{
}
..td-home-vertmenu
{
width: 141px;
}
..td-home-vertmenu a:link, .td-home-vertmenu a:visited, .td-home-vertmenu
a:active, .td-custom-home-vertmenu a:link, .td-custom-home-vertmenu
a:visited, .td-custom-home-vertmenu a:active
{
margin-top: 2px;
padding-right: 2px;
margin-bottom: 3px;
padding-left: 2px;
font-weight: bold;
font-size: x-small;
background-attachment: fixed;
background-image: url(Images/VertMenuBackground.jpg);
width: 141px;
color: white;
background-repeat: no-repeat;
font-family: Arial;
height: 23px;
text-decoration: none;
}
..td-home-vertmenu a:hover, .td-custom-home-vertmenu a:hover
{
margin-top: 2px;
padding-right: 2px;
padding-left: 2px;
font-weight: bold;
font-size: x-small;
background-attachment: fixed;
background-image: url(Images/VertMenuHoverBackground.jpg);
margin-bottom: 3px;
width: 141px;
color: #4b0082;
background-repeat: no-repeat;
font-family: Arial;
height: 23px;
text-decoration: none;
}

Html code:

<table>
<tr>
<TD class="td-home-vertmenu" vAlign="top">
<span id="HomeVerticalMenuControl1"><a
href="/www.test.edu/Administration/">Administration</a>
<a href="/www.test.edu/Admissions/">Admissions</a<a
href="/www.test.edu/Early+Admission/">
Early Admission</a<a href="/www.test.edu/Campus+Life/">Campus
Life</a<a href="/www.test.edu/test+Athletics/">
test Athletics</a<A title="Blackboard Link"
href="http://blackboard.test.edu/" target="_blank">
Blackboard</A><A title="test Net Link"
href="http://jenwebnew.test.edu/ics/?" target="_blank">test
Net</A><A title="Title III Link"
href="/www.test.edu/TitleIII.htm">Title III</A><A title="Alumni Link"
href="/www.test.edu/Alumni.htm">Alumni</A><A title="Bookstore Link"
href="/www.test.edu/Bookstore.htm">Bookstore</A><BR>
<A title="Current Students Link"
href="http://jenwebnew.test.edu/exweb/" target="_blank">
Current Students</A><BR>
<BR>
<BR>
</span>
</TD>
</tr>
</table>

推荐答案

" rodchar" < ro ***** @ discussion.microsoft.com写信息

news：34 *********************** *********** @ microsof t.com ...

"rodchar" <ro*****@discussions.microsoft.comwrote in message
news:34**********************************@microsof t.com...

它在ie6中正常工作，但在ie7和firefox中不正确。

it works correctly in ie6, but incorrectly in ie7 and firefox.

几乎所有上述陈述都属实的情况都是因为

标记不符合标准......


你的CSS看起来不错，但是你的HTML没有 - 你用的是什么DOCTYPE和

XHTLM一致性等级......？

-
http://www.markrae.net

In almost all cases where the above statement is true, the reason is because
the markup is not standards compliant...

Your CSS looks OK, but your HTML doesn''t - what DOCTYPE and
XHTLM-conformance level are you using...?
--
http://www.markrae.net

rodchar写道：

rodchar wrote:

嘿所有，

i有片段代表左侧导航菜单的代码

由asp.net 1.1中的样式表装饰


它在ie6中正常工作，但在ie7中不正确Firefox浏览器。

hey all,
i have snippet of code which represents a left-side navigation menu
decorated by a stylesheet all in asp.net 1.1

it works correctly in ie6, but incorrectly in ie7 and firefox.

我实际上从未见过任何实际存在的代码。 Firefox

和IE7主要遵循标准，而IE 6有一些严重的

渲染错误。


事实是，页面在IE7和Firefox中正确呈现，并且在IE 6中错误地显示了
。您构建的页面依赖于IE 6中的一些

渲染错误，即'这就是为什么它看起来只是你在该浏览器的那个

版本中看来。

I have actually never seen any code where that is actually true. Firefox
and IE7 mainly follows the standard, while IE 6 has some serious
rendering bugs.

The truth is that the page is rendered correctly in IE7 and Firefox, and
incorrectly in IE 6. You have built the page to rely on some of the
rendering bugs in IE 6, that''s why it only looks as you indend in that
version of that browser.

.td-home-vertmenu a：link， .td-home-vertmenu a：visited，.td-home-vertmenu

a：active，.td-custom-home-vertmenu a：link，.td-custom-home-vertmenu

a：visit，.td-custom-home-vertmenu a：active

{

margin-top：2px;

padding-right：2px;

margin-bottom：3px;

padding-left：2px;

font-weight：bold;

font-size：x-small;

background-attachment：fixed;

background-image：url（Images / VertMenuBackground.jpg）;

宽度：141px;

颜色：白色;

背景重复：不重复;

font-family：Arial;

身高：23px;

text-decoration：none;

}

.td-home-vertmenu a:link, .td-home-vertmenu a:visited, .td-home-vertmenu
a:active, .td-custom-home-vertmenu a:link, .td-custom-home-vertmenu
a:visited, .td-custom-home-vertmenu a:active
{
margin-top: 2px;
padding-right: 2px;
margin-bottom: 3px;
padding-left: 2px;
font-weight: bold;
font-size: x-small;
background-attachment: fixed;
background-image: url(Images/VertMenuBackground.jpg);
width: 141px;
color: white;
background-repeat: no-repeat;
font-family: Arial;
height: 23px;
text-decoration: none;
}

锚标记是内联元素。根据标准，宽度和

高度不适用于内联元素。 IE 6处理不正确，

并将宽度和高度应用于元素。


添加display：block;把锚标签变成块元素。


-

G ??跑安德森

_____
< a rel =nofollowhref =http://www.guffa.comtarget =_ blank> http://www.guffa.com

顺便说一下，下面是html的其余部分，你能查看

视频吗？只是想知道我已经尝试了几次并且从未要求

反馈？想知道它是否有帮助。


<％@ Page language =" c＃"代码隐藏= QUOT; WebForm1.aspx.cs中" AutoEventWireup =" false"

<！DOCTYPE HTML PUBLIC" - // W3C // DTD HTML 4.0 Transitional // EN" >

< HTML>

< HEAD>

< title> WebForm1< / title>

< meta name =" GENERATOR" Content =" Microsoft Visual Studio .NET 7.1"

< meta name =" CODE_LANGUAGE" Content =" C＃">

< meta name =" vs_defaultClientScript" content =" JavaScript">

< meta name =" vs_targetSchema"

content =" http://schemas.microsoft.com/intellisense/ie5" ;>

< LINK href =" StyleSheet2.css"类型= QUOT;文本/ CSS" rel =" stylesheet">

< / HEAD>

< body MS_POSITIONING =" GridLayout">

< form id =" Form1"方法= QUOT;交" runat =" server">


" Mark Rae"写道：

Here''s the rest of the html below, by the way, were you able to view the
video? just wondering i''ve tried this a few times and never asked for
feedback? wondering if it''s helping.

<%@ Page language="c#" Codebehind="WebForm1.aspx.cs" AutoEventWireup="false"
Inherits="WebApplication1.WebForm1" %>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN" >
<HTML>
<HEAD>
<title>WebForm1</title>
<meta name="GENERATOR" Content="Microsoft Visual Studio .NET 7.1">
<meta name="CODE_LANGUAGE" Content="C#">
<meta name="vs_defaultClientScript" content="JavaScript">
<meta name="vs_targetSchema"
content="http://schemas.microsoft.com/intellisense/ie5">
<LINK href="StyleSheet2.css" type="text/css" rel="stylesheet">
</HEAD>
<body MS_POSITIONING="GridLayout">
<form id="Form1" method="post" runat="server">

"Mark Rae" wrote:

" rodchar" < ro ***** @ discussion.microsoft.com写信息

news：34 *********************** *********** @ microsof t.com ...

"rodchar" <ro*****@discussions.microsoft.comwrote in message
news:34**********************************@microsof t.com...

它在ie6中正常工作，但在ie7和firefox中不正确。

it works correctly in ie6, but incorrectly in ie7 and firefox.

在几乎所有上述陈述都属实的情况下，原因是因为

标记不符合标准......


你的CSS看起来不错，但是你的HTML没有 - 你用的是什么DOCTYPE和

XHTLM一致性等级......？


-
http://www.markrae.net

In almost all cases where the above statement is true, the reason is because
the markup is not standards compliant...

Your CSS looks OK, but your HTML doesn''t - what DOCTYPE and
XHTLM-conformance level are you using...?
--
http://www.markrae.net

这篇关于css排除浏览器版本问题的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！