Максим Мартиросов

Что то типа того

<?php
	$categories = get_categories();
	
	foreach( $categories as $category ) {
		
		echo $category->name;
		
		$posts = get_posts( array(
			'post_type'		=> 'post',
			'posts_per_page'=> 3,
			'category'		=> $category->term_id
		) );
		
		foreach( $posts as $post ) {
			echo $post->post_title;
		}
	}
?>

Присоединяюсь ко всему выше сказанному. С тех пор как я стал использовать бутстрап, время разработки моих проектов сократилось как минимум на 30%. При чём с точки зрения заказчика ему абсолютно пофиг на то какими инструментами вы пользуетесь, ему главное результат и сроки выполнения. При чём бутстрапом я начал пользоваться не из-за отсутсвия опыта в верстке (не знания css), а просто потому, что понял что с ним легче. К тому же проекты построенные на бутстрапе в дальнейшем легче поддерживать, особенно если за поддержку берётся другой прогер. Скорей всего он вам даже спасибо скажет, что на бутстрапе сверстали =))
ИМХО, те кто говорят, что бутстрап не комильфо, скорей всего не прочувствовали всей прелести этого фреймворка.

Если делать адапривную вёрстку то нужно учитывать размеры минимум 4ч экранов (менее 420, до 768, до 992 и более 1200). все контейнеры ко умолчанию должны иметь css свойство box-sizing: border-box; и иметь степень вложенности .container>.row>.block где контейнер = width:100%, row = ширине относительно текущего media query (например 992px) и mergin-left: auto; mergin-right:auto;
для .row пишите что то типа этого

@media only screen and (max-width: 420px) {
 .row {
  width:419px;
 }
}
@media only screen and (max-width: 768px) {
 .row {
  width:766px;
 }
}
@media only screen and (max-width: 992px) {
 .row {
  width:991px;
 }
}
@media only screen and (min-width: 1200px) {
 .row {
  width:1280px;
 }
}

А вообще если вы только озадачились адаптивной вёрсткой, то советую вам сразу начать с изучении фреймворка bootstrap, который упростит вам работу в разы. (Ну или воспользоваться другими альтернативными css фреймворками)