Изначально решил делать шапку сайта в виде таблицы с высотой 100vh:
<table style="height: 100vh; width: 100%;">
<tbody>
<tr>
<td style="height: 0;">Тут вывожу меню</td>
</tr>
<tr>
<td>Тут фоновая картинка на всю видимую область экрана</td>
</tr>
</tbody>
</table>
Выше я привел пример с реальным
table чисто для наглядности, а на деле все стили у меня во внешних css-файлах, да и сама таблица заверстана на div-блоках. Собственно, на выходе я получаю нечто такое:

И все бы хорошо, но ячейку с фоновым рисунком я вывожу только на главной, соответственно, на всех остальных страницах получаю на этом месте пустоту во весь экран и тогда совсем не очевидно, что где-то там внизу еще есть контент.
Вот думаю, как бы избавится от 100vh, если нет ячейки с фоном? JavaScript применять не хочу, думаю это неправильно.
Как вариант, изначально прописывать 100vh инлайново, а затем уже на стороне php определять, нужно ли выдать 100vh или нет. Только этот вариант мне тоже не особо нравится. Подскажите, как обычно принято решать такую проблему на CSS?