iBird Rose

зачем ты вообще тогда container используешь если не хочешь чтоб адаптировалось? ставь свой класс другой. ну а про этот баг сложно сказать по фото. смотреть надо

при загрузке картиники узнавать ее width и height и записывать ей же в дата атрибут. а потом просто через JS и CSS определяя вертикальная она или горизонтальная - давать нужные классы и стили для них

если хочешь чтоб красиво - ставь бэкграундом

вот еще foundation.zurb.com/emails.html

Есть плагин для хрома "LivePage" еще. через него пробовал?

фигня это все. добавляй через бэкграунд для li. а лучше всего отдельным элементом иконкой

https://tech.yandex.ru/share/

а чем тебе эти классы не угодили? дурной тон? - с чего бы? учитывая что это пока топовый ксс фреймворк - никто не будет называть его элементы дурным тоном. с непривычки мб тока в глаза бросаются классы. больше ничего такого не вижу в бутсрапе.

• рамку сделать через box-shadow
  
• Градиент через www.colorzilla.com/gradient-editor
  
• треугольник справа через :after (по старинке готовой картинкой, либо сделать треугольник на ксс через border)
  

предположу что из за ширины скролла в браузерах телефонов

потому что количество th внутри tr должно быть равно количеству td внутри своих tr. а у тебя в thead 7 штук th, а в tbody td не 7 штук внутри своих tr

h1 - это и есть div по сути (тобишь твой блок (квадрат))
отличиний никаких нет

в обоих примерах на фоне видео. работает же