Instantly share code, notes, and snippets.
Created
September 30, 2013 15:38
-
Star
2
(2)
You must be signed in to star a gist -
Fork
0
(0)
You must be signed in to fork a gist
-
-
Save kbsali/6765663 to your computer and use it in GitHub Desktop.
Simply adds "hidden-inline-[xs|sm|md|lg] classes to bootstrap 3 (see https://github.com/twbs/bootstrap/issues/8869)
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| .hidden-inline-xs { | |
| display: inline !important; | |
| } | |
| tr.hidden-inline-xs { | |
| display: table-row !important; | |
| } | |
| th.hidden-inline-xs, | |
| td.hidden-inline-xs { | |
| display: table-cell !important; | |
| } | |
| @media (max-width: 767px) { | |
| .hidden-inline-xs { | |
| display: none !important; | |
| } | |
| tr.hidden-inline-xs { | |
| display: none !important; | |
| } | |
| th.hidden-inline-xs, | |
| td.hidden-inline-xs { | |
| display: none !important; | |
| } | |
| } | |
| @media (min-width: 768px) and (max-width: 991px) { | |
| .hidden-inline-xs.hidden-inline-sm { | |
| display: none !important; | |
| } | |
| tr.hidden-inline-xs.hidden-inline-sm { | |
| display: none !important; | |
| } | |
| th.hidden-inline-xs.hidden-inline-sm, | |
| td.hidden-inline-xs.hidden-inline-sm { | |
| display: none !important; | |
| } | |
| } | |
| @media (min-width: 992px) and (max-width: 1199px) { | |
| .hidden-inline-xs.hidden-inline-md { | |
| display: none !important; | |
| } | |
| tr.hidden-inline-xs.hidden-inline-md { | |
| display: none !important; | |
| } | |
| th.hidden-inline-xs.hidden-inline-md, | |
| td.hidden-inline-xs.hidden-inline-md { | |
| display: none !important; | |
| } | |
| } | |
| @media (min-width: 1200px) { | |
| .hidden-inline-xs.hidden-inline-lg { | |
| display: none !important; | |
| } | |
| tr.hidden-inline-xs.hidden-inline-lg { | |
| display: none !important; | |
| } | |
| th.hidden-inline-xs.hidden-inline-lg, | |
| td.hidden-inline-xs.hidden-inline-lg { | |
| display: none !important; | |
| } | |
| } | |
| .hidden-inline-sm { | |
| display: inline !important; | |
| } | |
| tr.hidden-inline-sm { | |
| display: table-row !important; | |
| } | |
| th.hidden-inline-sm, | |
| td.hidden-inline-sm { | |
| display: table-cell !important; | |
| } | |
| @media (max-width: 767px) { | |
| .hidden-inline-sm.hidden-inline-xs { | |
| display: none !important; | |
| } | |
| tr.hidden-inline-sm.hidden-inline-xs { | |
| display: none !important; | |
| } | |
| th.hidden-inline-sm.hidden-inline-xs, | |
| td.hidden-inline-sm.hidden-inline-xs { | |
| display: none !important; | |
| } | |
| } | |
| @media (min-width: 768px) and (max-width: 991px) { | |
| .hidden-inline-sm { | |
| display: none !important; | |
| } | |
| tr.hidden-inline-sm { | |
| display: none !important; | |
| } | |
| th.hidden-inline-sm, | |
| td.hidden-inline-sm { | |
| display: none !important; | |
| } | |
| } | |
| @media (min-width: 992px) and (max-width: 1199px) { | |
| .hidden-inline-sm.hidden-inline-md { | |
| display: none !important; | |
| } | |
| tr.hidden-inline-sm.hidden-inline-md { | |
| display: none !important; | |
| } | |
| th.hidden-inline-sm.hidden-inline-md, | |
| td.hidden-inline-sm.hidden-inline-md { | |
| display: none !important; | |
| } | |
| } | |
| @media (min-width: 1200px) { | |
| .hidden-inline-sm.hidden-inline-lg { | |
| display: none !important; | |
| } | |
| tr.hidden-inline-sm.hidden-inline-lg { | |
| display: none !important; | |
| } | |
| th.hidden-inline-sm.hidden-inline-lg, | |
| td.hidden-inline-sm.hidden-inline-lg { | |
| display: none !important; | |
| } | |
| } | |
| .hidden-inline-md { | |
| display: inline !important; | |
| } | |
| tr.hidden-inline-md { | |
| display: table-row !important; | |
| } | |
| th.hidden-inline-md, | |
| td.hidden-inline-md { | |
| display: table-cell !important; | |
| } | |
| @media (max-width: 767px) { | |
| .hidden-inline-md.hidden-inline-xs { | |
| display: none !important; | |
| } | |
| tr.hidden-inline-md.hidden-inline-xs { | |
| display: none !important; | |
| } | |
| th.hidden-inline-md.hidden-inline-xs, | |
| td.hidden-inline-md.hidden-inline-xs { | |
| display: none !important; | |
| } | |
| } | |
| @media (min-width: 768px) and (max-width: 991px) { | |
| .hidden-inline-md.hidden-inline-sm { | |
| display: none !important; | |
| } | |
| tr.hidden-inline-md.hidden-inline-sm { | |
| display: none !important; | |
| } | |
| th.hidden-inline-md.hidden-inline-sm, | |
| td.hidden-inline-md.hidden-inline-sm { | |
| display: none !important; | |
| } | |
| } | |
| @media (min-width: 992px) and (max-width: 1199px) { | |
| .hidden-inline-md { | |
| display: none !important; | |
| } | |
| tr.hidden-inline-md { | |
| display: none !important; | |
| } | |
| th.hidden-inline-md, | |
| td.hidden-inline-md { | |
| display: none !important; | |
| } | |
| } | |
| @media (min-width: 1200px) { | |
| .hidden-inline-md.hidden-inline-lg { | |
| display: none !important; | |
| } | |
| tr.hidden-inline-md.hidden-inline-lg { | |
| display: none !important; | |
| } | |
| th.hidden-inline-md.hidden-inline-lg, | |
| td.hidden-inline-md.hidden-inline-lg { | |
| display: none !important; | |
| } | |
| } | |
| .hidden-inline-lg { | |
| display: inline !important; | |
| } | |
| tr.hidden-inline-lg { | |
| display: table-row !important; | |
| } | |
| th.hidden-inline-lg, | |
| td.hidden-inline-lg { | |
| display: table-cell !important; | |
| } | |
| @media (max-width: 767px) { | |
| .hidden-inline-lg.hidden-inline-xs { | |
| display: none !important; | |
| } | |
| tr.hidden-inline-lg.hidden-inline-xs { | |
| display: none !important; | |
| } | |
| th.hidden-inline-lg.hidden-inline-xs, | |
| td.hidden-inline-lg.hidden-inline-xs { | |
| display: none !important; | |
| } | |
| } | |
| @media (min-width: 768px) and (max-width: 991px) { | |
| .hidden-inline-lg.hidden-inline-sm { | |
| display: none !important; | |
| } | |
| tr.hidden-inline-lg.hidden-inline-sm { | |
| display: none !important; | |
| } | |
| th.hidden-inline-lg.hidden-inline-sm, | |
| td.hidden-inline-lg.hidden-inline-sm { | |
| display: none !important; | |
| } | |
| } | |
| @media (min-width: 992px) and (max-width: 1199px) { | |
| .hidden-inline-lg.hidden-inline-md { | |
| display: none !important; | |
| } | |
| tr.hidden-inline-lg.hidden-inline-md { | |
| display: none !important; | |
| } | |
| th.hidden-inline-lg.hidden-inline-md, | |
| td.hidden-inline-lg.hidden-inline-md { | |
| display: none !important; | |
| } | |
| } | |
| @media (min-width: 1200px) { | |
| .hidden-inline-lg { | |
| display: none !important; | |
| } | |
| tr.hidden-inline-lg { | |
| display: none !important; | |
| } | |
| th.hidden-inline-lg, | |
| td.hidden-inline-lg { | |
| display: none !important; | |
| } | |
| } | |
| .visible-print { | |
| display: none !important; | |
| } | |
| tr.visible-print { | |
| display: none !important; | |
| } | |
| th.visible-print, | |
| td.visible-print { | |
| display: none !important; | |
| } | |
| @media print { | |
| .visible-print { | |
| display: inline !important; | |
| } | |
| tr.visible-print { | |
| display: table-row !important; | |
| } | |
| th.visible-print, | |
| td.visible-print { | |
| display: table-cell !important; | |
| } | |
| .hidden-inline-print { | |
| display: none !important; | |
| } | |
| tr.hidden-inline-print { | |
| display: none !important; | |
| } | |
| th.hidden-inline-print, | |
| td.hidden-inline-print { | |
| display: none !important; | |
| } | |
| } |
thanks a ton! i added visible-inline-* styles here, same method: https://gist.github.com/mdmalinowski/8343416
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
thx!