साँचा:Inline block/doc

मुक्त ज्ञानकोश विकिपीडिया से
नेविगेशन पर जाएँ खोज पर जाएँ

{{

 साँचा:namespace detect

| type = notice | image = | imageright = | class = | style = margin-bottom:1.0em; | textstyle = | text = साँचा:strong for साँचा:terminate sentence
It contains usage information, categories and other content that is not part of the original साँचा page. | small = | smallimage = | smallimageright = | smalltext = | subst = | date = | name = }}

Usage

The template साँचा:tlf creates an element—by default a साँचा:tag—that has the CSS property display:inline-block. There is support for a range of common style properties as template parameters, and an all-purpose style parameter.

One intended use is to replace साँचा:tl when coding templates with complex layout, which need to display differently on mobile and desktop. Like साँचा:tlf, it holds content together and avoids wrapping it where possible. However, if necessary, such as on small screens, the content will wrap.

Example of wrapping control

In each case the outline represents a width constraint, which might be affected by the user's screen size, other parts of the template, or both.

साँचा:inline blockसाँचा:inline blockसाँचा:inline blockColor of the atomic number shows state of matter (at 0 °C and 1 atm)
साँचा:inline blockसाँचा:inline blockसाँचा:inline blockColor of the atomic number shows state of matter (at 0 °C and 1 atm)
साँचा:inline blockसाँचा:inline blockसाँचा:inline blockColor of the atomic number shows state of matter (at 0 °C and 1 atm)

Here, each grey box and the text "Color of ..." are wrapped in साँचा:tlf templates. If साँचा:tlf had been used instead, there would be no visible difference in the first two cases. In the third case, however, the text would have been unable to wrap into the space available. On mobile, this might mean that a table or the whole article is forced to become horizontally scrollable.

TemplateData

The template {{Inline block}} creates an inline-block element. Among other uses, it can replace साँचा:tl when coding templates with complex layout.
प्राचलवर्णनप्रकारस्थिति
Content1
The content to be wrapped in an inline-block element
सामग्रीवैकल्पिक
Tag name2
Changes the HTML tag used. This may affect what elements this template should contain or be contained by.
डिफ़ॉल्ट
span
उदाहरण
div, abbr
स्ट्रिंगवैकल्पिक
Titletitle
Title of the content (used as tooltip text, or expanded abbreviation when 2=abbr
उदाहरण
died (for abbr d.)
स्ट्रिंगवैकल्पिक
Widthwidth
The width; passed directly to the "width" CSS attribute
स्ट्रिंगवैकल्पिक
Heightheight
The height; passed directly to the "height" CSS attribute
स्ट्रिंगवैकल्पिक
Text colorcolor
The text color; passed directly to the "color" CSS attribute
स्ट्रिंगवैकल्पिक
Background formattingbackground
bg
The background formatting; passed directly to the "background" CSS attribute
स्ट्रिंगवैकल्पिक
Other stylesstyle
Style information as plain CSS.
स्ट्रिंगवैकल्पिक

See also

साँचा:List of nowrap-like templates