Как будет правильней для адаптивности ширины колонок на разных разрешениях?

Question

[XinnogeN]

Как будет правильней для адаптивности ширины колонок на разных разрешениях?
1.

<div class="container">
	    <div class="row">
			<!-- Content
			================================================== -->
			<main role="main" class="col-12 col-sm-12 col-md-12 col-lg-8 col-xl-8">
			    {content}
            </main>	
			<!-- / Content
			================================================== -->
			
			
			
			<!-- Sidebar
			================================================== -->
			<aside class="d-none d-sm-none d-md-none d-lg-block col-lg-4 d-xl-block col-xl-4">
			    Right Sidebar
			</aside>	
			<!-- / Sidebar
			================================================== -->
		</div>
	</div>

2.

<div class="container">
	    <div class="row justify-content-center">
			<!-- Content
			================================================== -->
			<main role="main" class="col-12 col-sm-12 col-md-12 col-lg-8 col-xl-6">
			    {content}
            </main>	
			<!-- / Content
			================================================== -->
			
			
			
			<!-- Sidebar
			================================================== -->
			<aside class="d-none d-sm-none d-md-none d-lg-block col-lg-4 d-xl-block col-xl-3">
			    Right Sidebar
			</aside>	
			<!-- / Sidebar
			================================================== -->
		</div>
	</div>

Comments

[Froggyweb]

Писать меньше классов. Зачем перечислять все брейкпоинты? Наверное нет понимания как это рабоьает

[shmatuan]

Научиться писать через @media screen and (max-width: 992px) { } - в разы проще и правильнее будет

Answer 1

[Александр Суханов]

А о чем вы беспокоитесь ?
О лишних 10-100 байтах кода страницы ?
Визуально у вас 1 в 1 же :)
Я бы мог еще добавить
<div class="text-center"></div> и на блок выше повесить еще "центр", это преступление против верстки ?

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