I am using and for content in a header. Using a rendering program (PolyPane) to check different form factors doesn't look as expected.
Correctly shows mobile/non-desktop version of the header Galaxy Tab A8 (portrait) iPhone 375x548 (portrait)
Correctly shows the desktop version of the header Laptop 1344x1095
Incorrectly shows desktop version of the header Mobile 320x568 iPad 9th gen, iPad Air 4th gen, iPad Pro 9.7, iPad Pro 11 3rd gen, iPad Pro 12.9 5th gen, iPad mini 6th gen (all portrait view)