XS Responsive display?

rbekar · September 4, 2019, 3:32pm

I working on a contact us page and have the Phone number in two spans, one of which I have set to display including a link (Tel:XXX XXXX XXX) on SM or less, the other just as plain text on MD or above.

I'd like to just display the linked span at XS only and the plain text span at anything above.

The probelm I have is there's no XS option in the responsive display section, only SM, MD, LG, XL and Print.

Any help appreciated,

pervasiverichesllc · September 4, 2019, 4:05pm

(Tel:XXX XXXX XXX) for xs and md only ?

https://getbootstrap.com/docs/4.3/utilities/display/

twinstream · September 4, 2019, 4:30pm

.d-none .d-sm-inline

printninja · September 4, 2019, 8:54pm

Because Bootstrap 4 is based on a mobile-first mentality, XS is considered the "default size." So setting display none to the element would hide it at the XS size as well as every size above. You would then specifically change the sm, med, lg and xl displays to block (or whatever.)