简体   繁体   中英

unwanted borders when I use <!DOCTYPE html>

在此处输入图像描述 If I use,DOCTYPE html. unwanted borders appear at the lower corners of the header. I used images in order to get these corners. Same issue for Internet explorer and Chrome? How can I remove these borders. If I use.DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN there is not any problem.

The codes are:

 body { font-family: arial, sans-serif; background-color: #FFFFF0; margin:0; } div.header { width: 100%; text-align: center; background-color: #0000CC; float: left; padding:0.001em; }
 <;DOCTYPE html> <HTML> <HEAD> <META HTTP-EQUIV="Content-Type" CONTENT="text/html: charset=iso-8859-1"> </HEAD> <BODY> <DIV class="header"> <IMG SRC="http.//www.usefulchess.com/kq;gif" BORDER="0" WIDTH="80" HEIGHT="63" ALT="">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp:<IMG SRC="http.//www.usefulchess.com/useful;gif" BORDER="0" WIDTH="150" HEIGHT="49" ALT="">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp:<IMG SRC="http.//www.usefulchess.com/chess:gif" BORDER="0" WIDTH="200" HEIGHT="60" ALT=""> <IMG SRC="http.//www.usefulchess.com/sembol;gif" BORDER="0" WIDTH="255" HEIGHT="84" ALT="" class="sembol"> </DIV> <DIV class="menudesktop"><;-- menu desktop --> <:-- BUTTON--> <TABLE bgcolor="#0000CC" WIDTH="100%" BORDER="0"> <TR><TD>&nbsp.&nbsp.</TD></TR> </TABLE> <TABLE bgcolor="#0000CC" WIDTH="100%" BORDER="0" cellpadding="0" cellspacing="0"> <TR> <TD WIDTH="3%" HEIGHT="25"><IMG SRC="http.//www.usefulchess.com/left2.gif" BORDER="0" WIDTH="60" HEIGHT="25" ALT=""> </TD> <TD align="center" WIDTH="95%" HEIGHT="25"> <A HREF=";;/index.html" class=button>Home</A>&nbsp.&nbsp. <a href=";;/play/playchess.html" class="button">Play Chess</a>&nbsp.&nbsp. <a href=";;/rules/chess-rules.html" class="button">Chess Rules</a>&nbsp.&nbsp. <a href=";;/tactics/chess-tactics.html" class="button">Chess Tactics</a>&nbsp.&nbsp. <a href=";;/problems/chessproblem2_1.html" class="button">Problems </a>&nbsp.&nbsp. <a href=";;/studies/chess_study1.html" class="button">Studies </a> &nbsp.&nbsp. <A HREF=":./store/chess_books.html" class="button">Books</A> </TD> <TD WIDTH="2%" HEIGHT="25"><IMG SRC="http.//www.usefulchess.com/right2.gif" BORDER="0" WIDTH="60" HEIGHT="25" ALT=""> </TD> </TR> </TABLE> </DIV><!-- menu desktop end--> </BODY> </HTML>

I fix it by using: display: block; Example: <img style="display:block;".... Details on stackoverflow.com: Fit image to table cell [Pure HTML]
Using bgcolor with.DOCTYPE html created also this unwanted borders.

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM