Как здесь сделать чтобы при увеличении футер не налегал на всё остальное?

261

12 марта 2021, 12:10

<!DOCTYPE html> 
<html> 
<head> 
    <script type="text/javascript" src="http://code.jquery.com/jquery-latest.min.js"></script> 
    <script type="text/javascript" src="bigtext.js"></script> 
   <style> 
html,body{ 
   margin:0; 
   padding: 0; 
   box-sizing: border-box; 
 } 
 
html{height: 100%;border-style: solid; 
border-color: #58cdcd; 
border-width: 1px;}  
body{position: relative;  
  min-height: 100%; 
  border-style: solid; 
border-color: #cd5858; 
border-width: 1px; 
 
} 
 
.footer{ 
    position: absolute; 
    bottom: 0; 
    width: 100%; 
    left: 0; 
    text-align: center; 
    /*background-color: rgba(180, 215, 255, 0.096);*/ 
    height: 30px; 
    vertical-align: middle; 
    color: #383535; 
    font-family: 'Great Vibes', cursive; 
    /*color: rgb(233, 181, 38);*/ 
    border-style: solid; 
border-color: #cacd58; 
border-width: 1px; 
} 
.footer a{ 
  font-family: 'Great Vibes', cursive; 
  vertical-align: middle; 
color: #383535; 
/*color: rgb(233, 181, 38);*/ 
} 
 
.footer a:hover{ 
 /* color: rgba(6, 31, 100, 0.425);*/ 
 color: rgba(68, 68, 68, 0.781); 
 /*color: rgba(233, 181, 38, 0.671);*/ 
} 
 
  #page { 
 
    
 
    margin: 36px auto; 
 
width: 90%; 
border-style: solid; 
border-color: #58cd58; 
border-width: 1px; 
padding-bottom: 800px; 
} 
 
.blog { 
 
margin: 0 auto 53px; 
 
width: 93,75%; /* 900px / 960px */ 
border-style: solid; 
border-color: #58bbcd; 
border-width: 1px; 
} 
 
.blog .main { 
   
  float: left;  width: 62.8888889%;  /* 566px / 900px */ 
 
} 
 
.blog .other { 
   
float: right;  width: 36.7777778%;  /* 331px / 900px */ 
 
} 
.lede { 
 
padding: 0.8em 5.33333333%; /* 48px / 900px */ 
border-style: solid; 
border-color: #080806; 
border-width: 1px; 
} 
.recent-entries { 
   
margin: 0 auto; 
width: 69.7885196%; /* 231px / 331px */ 
border-style: solid; 
border-color: #cd5858; 
border-width: 1px; 
} 
.article { 
padding: 0 8.48056537%;  
 
 
/* 48px / 
566px */} 
 
.date { 
  float: left; 
   
   
  margin: 24px 0 0 -17.0886076%;  /* 81px / 474px */   
  width: 14.556962%;  /* 69px / 474px */ 
border-style: solid; 
border-color: #e7e725; 
border-width: 1px; 
} 
 
</style> 
</head> 
<body> 
    <div id="page">   
        <div class="blog section">  
             
            <h1 class="lede">Recently in <a href="#">The Bot Blog</a></h1> 
            <div class="main"> 
             
            <div class="article"> 
                <div class="date"> 
                    <h1>34</h1> 
                     
                  </div> 
                <a>fgggggggg 
                  ggggggggh ffffffffhgf hfgggggg 
                  ggggggh fghf fgggggggg 
                  ggggggggh ffffffffhgf hfgggggg 
                  ggggggh fghf fgggggggg 
                  ggggggggh ffffffffhgf hfgggggg 
                  ggggggh fghf fgggggggg 
                  ggggggggh ffffffffhgf hfgggggg 
                  ggggggh fghf fgggggggg 
                  ggggggggh ffffffffhgf hfgggggg 
                  ggggggh fghf fgggggggg 
                  ggggggggh ffffffffhgf hfgggggg 
                  ggggggh fghf fgggggggg 
                  ggggggggh ffffffffhgf hfgggggg 
                  ggggggh fghf fgggggggg 
                  ggggggggh ffffffffhgf hfgggggg 
                  ggggggh fghf fgggggggg 
                  ggggggggh ffffffffhgf hfgggggg 
                  ggggggh fghf fgggggggg 
                  ggggggggh ffffffffhgf hfgggggg 
                  ggggggh fghf fgggggggg 
                  ggggggggh ffffffffhgf hfgggggg 
                  ggggggh fghf fgggggggg 
                  ggggggggh ffffffffhgf hfgggggg 
                  ggggggh fghf fgggggggg 
                  ggggggggh ffffffffhgf hfgggggg 
                  ggggggh fghf fgggggggg 
                  ggggggggh ffffffffhgf hfgggggg 
                  ggggggh fghf fgggggggg 
                  ggggggggh ffffffffhgf hfgggggg 
                  ggggggh fghf fgggggggg 
                  ggggggggh ffffffffhgf hfgggggg 
                  ggggggh fghf fgggggggg 
                  ggggggggh ffffffffhgf hfgggggg 
                  ggggggh fghf fgggggggg 
                  ggggggggh ffffffffhgf hfgggggg 
                  ggggggh fghf fgggggggg 
                  ggggggggh ffffffffhgf hfgggggg 
                  ggggggh fghf fgggggggg 
                  ggggggggh ffffffffhgf hfgggggg 
                  ggggggh fghf fgggggggg 
                  ggggggggh ffffffffhgf hfgggggg 
                  ggggggh fghf fgggggggg 
                  ggggggggh ffffffffhgf hfgggggg 
                  ggggggh fghf fgggggggg 
                  ggggggggh ffffffffhgf hfgggggg 
                  ggggggh fghf fgggggggg 
                  ggggggggh ffffffffhgf hfgggggg 
                  ggggggh fghf fgggggggg 
                  ggggggggh ffffffffhgf hfgggggg 
                  ggggggh fghf fgggggggg 
                  ggggggggh ffffffffhgf hfgggggg 
                  ggggggh fghf fgggggggg 
                  ggggggggh ffffffffhgf hfgggggg 
                  ggggggh fghf fgggggggg 
                  ggggggggh ffffffffhgf hfgggggg 
                  ggggggh fghf fgggggggg 
                  ggggggggh ffffffffhgf hfgggggg 
                  ggggggh fghf fgggggggg 
                  ggggggggh ffffffffhgf hfgggggg 
                  ggggggh fghf fgggggggg 
                  ggggggggh ffffffffhgf hfgggggg 
                  ggggggh fghf fgggggggg 
                  ggggggggh ffffffffhgf hfgggggg 
                  ggggggh fghf fgggggggg 
                  ggggggggh ffffffffhgf hfgggggg 
                  ggggggh fghf fgggggggg 
                  ggggggggh ffffffffhgf hfgggggg 
                  ggggggh fghf fgggggggg 
                  ggggggggh ffffffffhgf hfgggggg 
                  ggggggh fghf fgggggggg 
                  ggggggggh ffffffffhgf hfgggggg 
                  ggggggh fghf fgggggggg 
                  ggggggggh ffffffffhgf hfgggggg 
                  ggggggh fghf fgggggggg 
                  ggggggggh ffffffffhgf hfgggggg 
                  ggggggh fghf fgggggggg 
                  ggggggggh ffffffffhgf hfgggggg 
                  ggggggh fghf fgggggggg 
                  ggggggggh ffffffffhgf hfgggggg 
                  ggggggh fghf</a> 
              </div> 
            </div><!-- /end .main --> 
 
            <div class="other"> 
              <div class="recent-entries"> 
<a>fgggggggg 
  ggggggggh ffffffffhgf hfgggggg 
  ggggggh fghf fgggggggg 
  ggggggggh ffffffffhgf hfgggggg 
  ggggggh fghf fgggggggg 
  ggggggggh ffffffffhgf hfgggggg 
  ggggggh fghf fgggggggg 
  ggggggggh ffffffffhgf hfgggggg 
  ggggggh fghf fgggggggg 
  ggggggggh ffffffffhgf hfgggggg 
  ggggggh fghf fgggggggg 
  ggggggggh ffffffffhgf hfgggggg 
  ggggggh fghf fgggggggg 
  ggggggggh ffffffffhgf hfgggggg 
  ggggggh fghf fgggggggg 
  ggggggggh ffffffffhgf hfgggggg 
  ggggggh fghf fgggggggg 
  ggggggggh ffffffffhgf hfgggggg 
  ggggggh fghf fgggggggg 
  ggggggggh ffffffffhgf hfgggggg 
  ggggggh fghf fgggggggg 
  ggggggggh ffffffffhgf hfgggggg fgggggggg 
  ggggggggh ffffffffhgf hfgggggg 
  ggggggh fghf fgggggggg 
  ggggggggh ffffffffhgf hfgggggg 
  ggggggh fghf fgggggggg 
  ggggggggh ffffffffhgf hfgggggg 
  ggggggh fghf fgggggggg 
  ggggggggh ffffffffhgf hfgggggg 
  ggggggh fghf fgggggggg 
  ggggggggh ffffffffhgf hfgggggg</a> 
</div> 
            </div><!-- /end .other -->   
          </div><!-- /end .blog.section --> 
           
          <div class="footer"><a>fOOTER</a> 
          </div> 
        </div><!-- /end #page --> 
 
     
         
         
</body> 
</html>

ПОСЛЕДНИЕ ВОПРОСЫ

Все вопросы

ТОП-10

Все популярные вопросы

поиск определенного tag в на сайте

Есть такая задача, необходимо найти опрделенный вид товара на сайтеКак это возможно сделать с помощью JAVA? А если конкретнее, то есть запрос...

168

HTML

WebView не видит изменений в коде HTML/JS

WebView читает локальный indexhtml с внутренний памяти приложения

163

Почему тега изображения нет в скачанном HTML и как его спарсить?

ПримерВот тут, в самом нижнем посте картинка с котиком, под спойлером:

187

Получить значение из ComboBox

Есть коллекция Dictionary(string,int) которая привязана к ComboBoxПри выборе 1 из пунктов в ComboBox мне необходимо положить значения взятые из него в разные...

206