Андрей Федоров

Вот так:

.tooltip-src:hover + span,
.tooltip-src + span:hover {
opacity:1;
visibility:visible; 
}

без скриптов
codepen.io/aliencash/pen/vxxWRb?editors=1100

codepen.io/aliencash/pen/WpRbGd

Можно с помощью атрибута pattern для input и регулярного изображения. Только учтите, что в случае атаки на форму, будут атаковать серверный скрипт, и валидация на стороне клиента уже не будет работать, даже если это js.

Ниже привожу регулярку только примерно. По точнее сами придумайте, согласно вашим условиям.

<input class="btn-input order-count" type="text" pattern="[1-9]\d{2}">

Вам нужно давать стили видимости не только при наведении на исходный блок но и при наведении на появляющийся блок - codepen.io/aliencash/pen/gmLXGp?editors=1100

Вам нужно в meta-теге link указать параметр media.

<link href="style.css" rel="stylesheet" type="text/css" media="handheld">

Тогда стили будут грузиться только на мобильных.

Тут вопросы по верстке, а не по фотошопу - код пациента в студию.

Это не так делается. codepen.io/aliencash/pen/OpXWBO

Не нравятся обертки - сделайте таблички. codepen.io/aliencash/pen/evJwmx
ps: )))

Ну вы даете. Говорите что съезжает, а самого, того что съезжает в коде нет. Оригинально.
Поправил ваш код:
codepen.io/aliencash/pen/pevKKm?editors=1100

<div onclick="window.location='http://ya.ru';"></div>

div {
  width: 200px;
  height: 300px;
  background: white;
  border: 2px black solid;
  margin-top: 50px;
  position: relative;
  pointer-events: none;
}

div:before {
  border: 2px black solid;
  border-bottom: none;
  content: 'Новости';
  display: inline-block;
  height: 25px;
  background: white;
  position: absolute;
  top: -27px;
  pointer-events: all;
  cursor: pointer;
}
div:hover:before {
  color: #00d;
  text-decoration: underline;
}

Этот фрагмент:

<?php
            	$i = 6;
                foreach ($this->serverList as $value) {
                    if ($value['check'] == true) $checked=" checked ";
            		else $checked = " ";
            		echo '<td style="width:66px;"><input type="checkbox" name="top_'.$value['top'].'"'.$checked.'/>.'.$value['top'].'</td>';
                    $i++;            		
            		if ($i > 0) {
            		    $i = 0;
            		    echo '</tr><tr>';
            		}
            	}
            ?>

замените на:

<?php
            	$i = 3;
                foreach ($this->serverList as $value) {
                    if ($value['check'] == true) $checked=" checked ";
            		else $checked = " ";
            		echo '<td style="width:66px;"><input type="checkbox" name="top_'.$value['top'].'"'.$checked.'/>.'.$value['top'].'</td>';
                    $i++;
                    if ($value['check'] == true) $checked=" checked ";
            		else $checked = " ";
            		echo '<td style="width:66px;"><input type="checkbox" name="top_'.$value['top'].'"'.$checked.'/>.'.$value['top'].'</td>';
                    $i++;
            		if ($i > 0) {
            		    $i = 0;
            		    echo '</tr><tr>';
            		}
            	}
            ?>

Пишу примерно, отлаживайте сами...

Если английским владеете - вот руководство от буржуев.
https://hackernoon.com/a-guide-to-cross-browser-te...