Home >Web Front-end >HTML Tutorial >Why can input width be set_html/css_WEB-ITnose
Why can input width be set_html/css_WEB-ITnose
- WBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOriginal
- 2016-06-24 12:15:241533browse
I have always been puzzled by this issue. According to the definition of CSS, it is not possible to set the width and height of inline (inline) elements, but what about the input of Shenma, which is an inline element? Can any expert explain it?
Reply to the discussion (solution)
Good morning,
That means input is not an inline (inline) element. Is it an inline element? Completely You can switch it through the CSS definition
Use firebug to see if it is an inline element. I used to take it for granted that input is an inline-block, but today I discovered that it turns out to be a living inline element. Element, why can the width of this product be set? Why is this?
I accidentally discovered an interesting problem during a certain layout. The previous concept was that d5fd7aea971a85678ba271703566ebfd is an inline element, and the width and height of inline elements cannot be determined. But obviously d5fd7aea971a85678ba271703566ebfd can be given width and height. Why? To understand, first we need to understand the inline-block attribute. Please click here to view: inline-block attribute. In fact, it is very simple. The inline-block attribute means that the outside of the element is an inline element, and the inside is indeed a block-level element, and d5fd7aea971a85678ba271703566ebfd has a natural inline-block attribute. This explains it easily. The d5fd7aea971a85678ba271703566ebfd element does not start a new line because its outer part is an inline element, but it can have a fixed width and height because its inner part is a block-level element. So when talking about inline elements and block-level elements, you must understand d5fd7aea971a85678ba271703566ebfd as a special case. ..
This is someone’s explanation. . .
It can be understood roughly like this:
Inline (inline) elements are called inline elements that can be displayed in the same line as other sibling elements relative to the left and right elements. For data display classes only For elements such as span, it is estimated that the width and height cannot be set. For input elements, such as input, the height can be set. . . It seems that it should be understood this way,
I accidentally discovered an interesting problem during a certain layout. The previous concept was that d5fd7aea971a85678ba271703566ebfd is an inline element, and the width and height of inline elements cannot be determined. But obviously d5fd7aea971a85678ba271703566ebfd can be given width and height. Why? To understand, first we need to understand the inline-block attribute. Please click here to view: inline-block attribute. In fact, it is very simple. The inline-block feature means that the outside of the element is an inline element, and the inside is indeed a block-level element. And d5fd7aea971a85678ba271703566ebfd is naturally inline-blo... This is how I understood it before, but. . You'd better use firebug to see it yourself. .
I understand what are inline elements and what are block-level elements, please don’t teach me about them. .
Well, after testing, it turns out that this is a firefox bug. .
<!doctype><html><head> <style> </style></head><body> <input type="text" value="text" id="input"/> <script> var input = document.getElementById('input'), input_style = window.getComputedStyle ? window.getComputedStyle(input, null) : input.currentStyle; alert(input_style.display); </script></body></html>In other browsers, input's display=inline-block; in Firefox, it is inline. . But I have another question. Inline-block is not supported in IE6. Can anyone with IE6 help me test it? This is how it is stipulated.
The width of the inline element button img can be set. . . How to explain
Well, after testing, it turns out that this is a firefox bug. . JScript code
b58a34321230aaefb1e48ec58d4b3453
100db36a723c770d327fc0aef2ce13b1
93f0f5c25f18dab9d176bd4f6de5d30e
c9ccee2e6ea535a969eb3f532ad9fe89
🎜> Who said that IE6 does not support inline-block? Or where did you see it?