Difference between revisions of "Template talk:Listbox"

From Yugipedia
Jump to: navigation, search
(Table to divs)
m (Text replacement - "\{\{[Tt]alkheader" to "{{Talk header")
 
(3 intermediate revisions by 2 users not shown)
Line 1: Line 1:
{{Talkheader}}
+
{{Talk header}}
  
 
==Table to divs==
 
==Table to divs==
Line 30: Line 30:
  
 
| list1  | list2  | list3  |
 
| list1  | list2  | list3  |
|        +------------------
+
|        |------------------
 
| list1r2 | list4  | list5  |
 
| list1r2 | list4  | list5  |
 
</pre>
 
</pre>
Line 41: Line 41:
 
|---------+--------+--------+
 
|---------+--------+--------+
 
| list1r2 | list4  | list5  |
 
| list1r2 | list4  | list5  |
 +
</pre>
 +
 +
until the screen gets shrunk, in which case it becomes:
 +
 +
<pre>
 +
+--- page width ---+
 +
 +
| list1            |
 +
| list1r2          |
 +
--------------------
 +
| list2            |
 +
--------------------
 +
| list3            |
 +
--------------------
 +
| list4            |
 +
--------------------
 +
| list5            |
 
</pre>
 
</pre>
  
Line 47: Line 64:
 
-- [[User:Deltaneos|Deltaneos]] ([[User talk:Deltaneos|talk]]) 18:36, June 15, 2014 (UTC)
 
-- [[User:Deltaneos|Deltaneos]] ([[User talk:Deltaneos|talk]]) 18:36, June 15, 2014 (UTC)
 
</div>
 
</div>
 +
 +
:::Okay, sounds good. I take it you've got markup ready to go for this? <span class="nowrap">「[[User:Dinoguy1000|<span style="color:#00f;">ディノ</span><span style="color:#080;">奴</span>]][[Special:Contributions/Dinoguy1000|<span style="color:#F90;">千?!</span>]]」<sup>[[wikipedia:Help:IJP|?]] · [[User talk:Dinoguy1000#top|☎ Dinoguy1000]]</sup></span> 19:19, June 16, 2014 (UTC)

Latest revision as of 09:22, 6 August 2018

This is the talk page for discussing the page, Template:Listbox.

Please try to

  • Be polite
  • Assume good faith
  • Be welcoming

Table to divs[edit]

Would there be any problem with replacing the table layout with divs?:

  • Changing the <table></table> tags to <div></div> tags with a clearfix
  • Removing the <tr></tr> tags
  • Replacing the <td></td> tags with <div></div> tags with the CSS float:left;width:33%;min-width:274px;

So that if the {{Decklist}} doesn't fit on the screen, the sections will line up vertically instead of either squashing or going off the screen? -- Deltaneos (talk) 23:56, June 13, 2014 (UTC)

As long as it doesn't break anything, I'd be all for it. How will it handle the Extra Deck box, though? While we're at it, we might as well move the CSS to MediaWiki:Common.css. ディノ千?!? · ☎ Dinoguy1000 04:50, June 14, 2014 (UTC)

When the screen is wide enough, it would display as it does now. When it's smaller, "Extra Deck" would appear vertically between "Monsters" and "Spells". -- Deltaneos (talk) 18:16, June 15, 2014 (UTC)

I hadn't thought about when there are more or less than three columns.

This is what it looks like if only two columns are used:

+------- page width --------+

| list1   | list2  |

And when all sections are used:

+------- page width --------+

| list1   | list2  | list3  |
|         |------------------
| list1r2 | list4  | list5  |

which looks visually the same as:

+------- page width --------+

| list1   | list2  | list3  |
|---------+--------+--------+
| list1r2 | list4  | list5  |

until the screen gets shrunk, in which case it becomes:

+--- page width ---+

| list1            |
| list1r2          |
--------------------
| list2            |
--------------------
| list3            |
--------------------
| list4            |
--------------------
| list5            |

But it is possible in CSS3 to change the width depending on the number of columns. So we can have width: 50% for 2, 33% for 3 etc.

-- Deltaneos (talk) 18:36, June 15, 2014 (UTC)

Okay, sounds good. I take it you've got markup ready to go for this? ディノ千?!? · ☎ Dinoguy1000 19:19, June 16, 2014 (UTC)