removing table border
I cannot get rid of this table border.
The initial HTML/CSS is from the ASP.NET MVC default.
I removed a lot of code and added a table on top.
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>@ViewBag.Title</title>
<link href="@Url.Content("~/Content/Site.css")" rel="stylesheet" type="text/css" />
<script src="@Url.Content("~/Scripts/jquery-1.5.1.min.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/modernizr-1.7.min.js")" type="text/javascript"></script>
</head>
<body>
<div class="page">
<table border=0 width=1000 style="border-collapse:collapse;" cellspacing="0" cellpaddi开发者_运维技巧ng="0">
<tr>
<td rowspan=2>
<img src="/Content/Images/elk_banner.jpg" />
</td>
<td>
<div id="logindisplay">
@Html.Partial("_LogOnPartial")
</div>
</td>
</tr>
</table>
<section id="main">
@RenderBody()
</section>
<footer>
</footer>
</div>
</body>
</html>
I've tried commenting out ALL the CSS, but I can't get rid of it.
My only guess is that one of the cryptic .js files is interferring with it. Or one of these exotic HTML containers is doing it.
Any guesses? I've googled around, but to no avail. I suppose it's something small I'm overlooking.
Try giving your table an ID and then using !important to set border to none in CSS. If JavaScript is tampering with your table then that should get around it.
<table id="mytable"
...
table#mytable,
table#mytable td
{
border: none !important;
}
Please try to add this into inside the table tag.
border="0" cellspacing="0" cellpadding="0"
<table border="0" cellspacing="0" cellpadding="0">
...
</table>
To remove from all tables, (add this to the head or external style sheet)
<style type="text/css">
table td{
border:none;
}
</style>
This will do it with border-collapse
table{
border-collapse:collapse;
}
From your case, you need to set the border to none on <table> and <td> tags.
<table width=1000 style="border:none; border-collapse:collapse; cellspacing:0; cellpadding:0" >
<tr>
<td style="border:none" rowspan=2>
<img src="/Content/Images/elk_banner.jpg" />
</td>
<td style="border:none">
<div id="logindisplay">
@Html.Partial("_LogOnPartial")
</div>
</td>
</tr>
</table>
Use Firebug to inspect the table in question, and see where does it inherit the border from. (check the right column). Try setting on-the-fly inline style border:none; to see if you get rid of it. Could also be the browsers default stylesheets. In this case, use a CSS reset. http://developer.yahoo.com/yui/reset/
Most of the time your background color is different from the background of your table. Since there are spaces between the cells, those spaces will create the illusion of lines with the color of the background behind the table.
The solution is to get rid of those spaces.
Inside the table tag write:
cellspacing="0"
Use table style Border-collapse at the table level
border-spacing: 0; should work as well
.yourClass>tbody>tr>td{border: 1px solid #ffffff !important;}
加载中,请稍侯......
精彩评论