IvanIvanIvanIvanIvan

Все дело в том, что у вас блокам назначен display: inline-block;. А все инлайновые блоки по умолчанию выравниваются по вертикали по baseline, у которой есть зазор снизу. Именно этот отступ вы и видите. Что бы его убрать, пропишите инлайн блокам vertical-align: top (или middle/bottom, что вам больше подойдет).

Все из за display: inline-block;
добавьте font-size: 0 для родителя и отступа не будет

Вот универсальный и расширяемый вариант:

var auto = [
  {
    marka: "BMW",
    model: "4k",
    cuzov: "A",
 },
 {
   marka: "Merc",
   model: "4k",
   cuzov: "B",
 },
 {
   marka: "Audi",
   model: "3k",
   cuzov: "C",
 },
 {
    marka: "Toyota",
    model: "1k",
    cuzov: "D",
 },
 {
    marka: "Lexus",
    model: "2k",
    cuzov: "E",
 },
 {
    marka: "Rang",
    model: "3k",
    cuzov: "F",
 },
 {
   marka: "BMW",
   model: "4k",
   cuzov: "G",
 },
 {
   marka: "BMW",
   model: "2k",
   cuzov: "Y",
 },
 {
   marka: "Audi",
   model: "3k",
   cuzov: "U",
 }
];

var marka = ["Audi", "Rang", "Merc"];
var model = ["4k", "2k", "3k"];
var cuzov = [];
var params = { marka, model, cuzov };
var activeKeys = Object.keys(params).filter(key => params[key].length);   
  
var rez1 = auto.filter(x => activeKeys.every(key => params[key].includes(x[key])) );

console.log(rez1);

Можно расширять объект параметров фильтрации. Параметры без элементов, отфильтровываются до этапа сравнения.

Да это нормально. И это одна из причин, почему раньше использовали флоаты, перенос контента был удобен для создания перечисляемых элементов или для работы с @media. Это неочевидное поведение, но сейчас в 2к18 есть флексы, на которых всё читаемо и понятно.

Блок #two тоже меняет свое расположение, но поскольку у вас фиксированная ширина #header, то при некоторых разрешениях левый край просто не виден (и появляется горизонтальный скрол). Измените параметр width на max-width у блока #header, что бы весь блок вмещался на маленьких экранах.

Если он отсутствуют, значит вам надо скачать данный шрифт.
Найти (google) данный шрифт по названию, скачать, установить. И у вас получиться)

с https://fonts.google.com/

Примерно так
https://jsfiddle.net/zzz6y68e/2/

https://jsfiddle.net/wg8vkxLe/1/
Потому что див(у которого display:block) занимает всю ширину.

Добавьте дочернему элементу display: inline-block;

либо уберите у родительского text-align: center; и добавьте дочернему margin: 0 auto;

Сразу скажу - почитайте про аргументы map. relax туда передавать нельзя в данном случае. Код такой -

var relax = ["noga", "ruka", "noc", "golova", "stypny"]
  var lis = relax.map(function(item, index){
    return relax[4] && index == 3 ? item = 'другая строка' : item;
  })

var relax = ["noga", "ruka", "noc", "golova", "stypny"]
  for(var i = 0; i< relax.length; i++){
    if ( i == 3 && relax[4] ) {
        relax[i] = 'другая строка';
    }
  }

картинку прижмите вправо и все получится.

вместо to попробуй задай процентное значение в анимации. то есть 100%; А вообще код скинь куда-нибудь в кодпен. И попробуй убрать инлайн стили у блока, а именно изменяемое значение ширины.