Home > Web Front-end > HTML Tutorial > Why do the text box set to 100% and the div set to 100% have different widths_html/css_WEB-ITnose

Why do the text box set to 100% and the div set to 100% have different widths_html/css_WEB-ITnose

WBOY
Release: 2016-06-24 12:17:40
Original
1691 people have browsed it

<table style="width:200px">        <tr>            <td style="padding-right:4px">                <input id="Text1" type="text" style="width:100%;height:16px;border:1px solid #b7d1eb" />            </td>        </tr>        <tr>            <td style="padding-right:4px">                <div style="width:100%;height:16px;border:1px solid #b7d1eb">                </div>            </td>        </tr>    </table>
Copy after login


I want two alignment effects, that is, when the width of the text box and div is set to 100%, they are visually the same width and need to be aligned. How to write css style.


Reply to the discussion (solution)

I tried it, and it felt inconsistent to set both elements to 100%, but I can set the width of the div to 99% , if the length does not exceed 300, they will appear to be uniform visually

This will definitely tell you that it is a browser problem. It's not aligned under IE9, it's aligned under Firefox, it's aligned under Apple. Therefore, at this time, it is recommended to write in a way that is compatible with multiple browsers, and it is not recommended to write div

in the table.
source:php.cn
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template