Андрей Б.

Это такая особенность margin. Должны быть ограничивающие свойства, иначе margin будет переходить от внутреннего блока к внешнему.

Решить это можно задав родительскому блоку border 1px solid transparent или overflow любое значение кроме visible.
Лично я использую padding.

<form>
  <input type="submit"> <!-- Кнопка должна быть первой в разметке -->
  <div class="field">
    <input type="text">
  </div>
</form>

form {
  width: 50%;
  margin: 50px auto;
}
input {
  box-sizing: border-box;
}
input[type="text"] {
  width: 100%;
}
.field {
  margin-right: 90px; /* Ширина кнопки + отступ */
}
input[type="submit"] {
  float: right;
  width: 80px;
}

https://jsfiddle.net/7zce4hjf/

Решения нет и не будет, так работает рендеринг шрифта.
Подгоните единожды line-height и не парьтесь, PP вам тут не добиться

Это из-за before, который перекрывает все. Переделал прошлый вариант на outline codepen.io/anon/pen/RrPLeR?editors=110
Либо можете указать для before свойство pointer-events

codepen.io/anon/pen/MKwvVp?editors=110

все работает

Можно и без calc()

Достаточно сделать таким образом:

.fullscreen {
   position: relative;
}
.re-fukop {
   ...
   left: 0;
   padding: 0 109px;
   box-sizing: border-box;
}

/* Либо еще проще */
.re-fukop {
   ...
   width: 100%; /* убрать */
   left: 109px;
   right: 109px;
}

Потому что псевдоэлементы не относятся к DOM. Вешайте класс с заранее подготовленным псевдоэлементом в CSS.

codepen.io/anon/pen/epvdLZ

Запрос mixin grid stylus
первая ссылка davidwalsh.name/stylus-grid

Это баг https://bugzilla.mozilla.org/show_bug.cgi?id=975632

Добавить

.wrapper {
    ....
    table-layout: fixed;
    width: 100%;
}
img{
    max-width: 100%;
}

Заменить max-width: 150px; и min-width: 150px; на

.two {
    ....
    width: 150px;
}

table-cell это ячейка таблицы и на неё не действует max/min-width и плюс max/min-width с одинаковым значением это все равно что width 150

и это тоже не нужно

.main {
   .....
    width: 100%;
    max-width: 200px;
}

jsfiddle.net/ufwvr90r

codepen.io/anon/pen/LpxWor

$("selector").each(function(){
    currentText = $(this).text();
    $(this).text(currentText.split(",")[0]);
});

Распечатать сие творение на бумагу, схватить за шкирку и тыкать как котенка приговаривая "что это за говно".
Если человек далеко, забить и искать нового исполнителя, этому товарищу еще многому нужно учится.

Объяснять ему как делать правильно. Зачем это вам? Вы заказчик, он исполнитель, работа не устраивает - давай до свидания. Само собой указать на ошибки нужно, а-ля аргументы, может человек в следующий раз исправится.
Выдавать такой шлак да еще и просить за это деньги, это не уважение к заказчику. Как говорится, не знание закона не избавляет от ответственности.