Recommended Posts

Здравствуйте.

Скорей всего footer со стилем position:absolute;

Share this post


Link to post
Share on other sites

Задаю контенту фиксированную высоту, но все равно он под футером. Вы не знаете, лучше оставить высоту футера auto?

 

<main class="project">
    
    <div class="blog-container">
        <div class="blog-header">
            <div class="blog-cover">
                
            </div>
        </div>
        <div class="blog-body">
            <div class="blog-title">
                <h1><a href="#">Lorem ipsum dolor sit amet</a></h1>
            </div>
            <div class="blog-text"><p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Neque sapiente quae enim eius sit ratione doloremque, non quo, quaerat soluta sint aspernatur nostrum doloribus dolor perferendis saepe numquam molestiae rerum. Iusto explicabo molestias cumque expedita officia repellendus excepturi vitae iure.</p>
            </div>
            <div class="blog-tags">
                <ul>
                    <li><a href="#">Lorem</a></li>
                    <li><a href="#">ipsum</a></li>
                    <li><a href="#">dolar</a></li>
                    <li><a href="#">consectetur</a></li>
                </ul>
            </div>
        </div>
        <div class="blog-footer">
            <ul>
                <li class="published-date">4 days ago</li>
            </ul>
        </div>
    </div>

    
</main>

<footer>
    
<nav>
    
<a href="index.html">HOME</a>
                <a href="projects.html">PROJECTS</a>
                <a href="blog.html">BLOG</a>
                <a href="contact.html">CONTACT</a>
                <a href="about.html">ABOUT</a>
                <a href="services.html">SEVICES</a>
                <a href="location.html">LOCATION</a>
                

</nav>
<div class="logo">
    <a href="index.html"><img class="graphiclogo" src="logo.png" alt="logo"></a>
</div>
<div class="social">
    <a href="#"><img src="img/social/em.png" alt="em"></a>
    <a href="#"><img src="img/social/face.png" alt="em"></a>
    <a href="#"><img src="img/social/goo.png" alt="em"></a>
    <a href="#"><img src="img/social/inst.png" alt="em"></a>
    <a href="#"><img src="img/social/pint.png" alt="em"></a>

</div>

<p>Version 2019</p>
</footer>
    <script src="js/script.js"></script>
</body>

 

 

 

 

 

 

 

 

 

 

.blog-container {
    background: #fafafa;
    border-radius: 5px;
    box-shadow: rgba(0,0,0,0.2) 0 4px 2px -2px;
    font-weight: 100;
    margin: 48px auto;
    margin-bottom: 100px;
    width: 50rem;
    height: 20px;

}

footer {
    width: 100%;
    height: auto;
    background: black;
    margin: 0 auto;
    text-align: center;
    padding-top: 25px;
    position:absolute; 
    bottom:0
}

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now

  • Similar Content

    • By digenis
      Проблема заключается в том что мне нужно чтобы изображение было на левом краю до конца блочного элемента, а список чтобы был справа и также до конца блочного элемента. Это все в заголовке.  https://jsfiddle.net/Lyguc520/3/

    • By envoleon
      Всем привет. Примерно год назад, я пытался устроиться в одну компанию( не помню название). В общем там дали 3 тестовых задания для рассмотрения знаний. Первый был связан с html и css. Остальные два с javascript и mysql. На все про все давалось пол дня. По первому впечатлению первый оказался самым легким, но не тут то было (из-за чего я и провалил тест), о нем и пойдет речь в этой теме, так как с остальными я управился за час.

      После провала, я решил не сдаваться и попробовать добить это первое задание. Бился на нем днями. Так его и не решил. Так его и не решили мои знакомые друзья (которые имеют хороший опыт в верстке). Я не знаю в чем подвох, может вы мне подскажите?
       
      Вот само задание
      Может кто из вас сможет его решить, потому что я уже перепробовал очееень много разных способов? Может даже создатель этого задания сидит тут.
      В заранее, прежде чем думать, что вы решили его за 5 минут с лета, внимательно прочитайте все условия (Тут не все так просто и вправду нужно подумать)
      Никакие советы не принимаются. только готовое решение, которое вы сами уже протестировали. Буду проверять, укажу на ошибки, если будут.
      Время для выполнения не ограничено, это чисто на интерес каждого, проверить свои способности.
  • Member Statistics

    46,530
    Total Members
    3,128
    Most Online
    marizza40
    Newest Member
    marizza40
    Joined
  • Recently Browsing   0 members

    No registered users viewing this page.