@SplashWeb

Как перемещать меню при низком разрешении экрана?

Здравствуйте! Стоит задача на имеющемся сайте, при разрешении экрана от 480px и ниже, перемещать навигацию вниз страницы. Меню располагаются слева и справа. По середине контент. Вот пример:
<table width="100%" cellpadding="0" cellspacing="0">
			  <tr>
				<td valign="top">
				<div>Навигация</div>
				<div>
				<ul>
				   <li><a href="#">Пункт</a></li>
				   <li><a href="#">Пункт</a></li>
				   <li><a href="#">Пункт</a></li>
				   <li><a href="#">Пункт</a></li>
				   <li><a href="#">Пункт</a></li>
				   <li><a href="#">Пункт</a></li>
                </ul>
                </div>
				  </td>
				  <td valign="top">
					  <h1>Заголовок</h1>
					  Текст на странице
				</td>
				<td valign="top">
				<div>Навигация</div>
				<div>
				<ul>
				   <li><a href="#">Пункт</a></li>
				   <li><a href="#">Пункт</a></li>
				   <li><a href="#">Пункт</a></li>
				   <li><a href="#">Пункт</a></li>
				   <li><a href="#">Пункт</a></li>
				   <li><a href="#">Пункт</a></li>
                </ul>
                </div>
		</td>
	</tr>
</table>


В CSS прописываю @media screen and (max-width: 480px)
а в шаблоне
<meta name="viewport" content="width=device-width, initial-scale=1.0">

но как сдвигать навигацию вниз?
  • Вопрос задан
  • 220 просмотров
Решения вопроса 1
Ankhena
@Ankhena
Нежно люблю верстку
table? 2016? класс!

Если оставить этот табличный раритет, то в media для мелких верхнее меню скрывать display:none, нижнее показывать. Для больших - соответственно наоборот.

Ну а по-хорошему, переверстать нормально.
Ответ написан
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Похожие вопросы