Odoo Help

Welcome!

This community is for beginners and experts willing to share their Odoo knowledge. It's not a forum to discuss ideas, but a knowledge base of questions and their answers.

4

How to create div in QWeb that is always at the bottom of the page?

By
Yenthe
on 1/5/15, 6:26 AM 3,663 views

Hi guys

What is the correct way to create a div that is always showed on the bottom of the page?
I want to have a div print some text that is always right above the (custom) footer.
See this example:


Could anybody tell me the correct way to do this?
An example that I tried:

<?xml version="1.0" encoding="utf-8"?>
<openerp>
<data>
<template id="report_saleorder_document">
    <t t-call="report.external_layout">
        <div class="page">
            <div class="oe_structure"/>
            <div class="row">
<!--Lots of irrelevant code for this question -->
<div class="oe_structure"/>
       <div style="float:bottom;width:100%;height:50px;bottom:0;">
        <p>
        Custom content right above footer
        </p>
    </div>
</div>
    </t>
</template>

I've been trying with float:bottom etc but its not giving what I want. So  is there anything custom built-in for this in QWeb?

Why can't you include your "custom content right above the footer" in the footer?

Stephen Mack
on 1/5/15, 8:43 AM

Because we already have a rather big footer and they don't want the footer to be higher. Plus the horizontal line would be above the text and the font should be different too.. So its something I'd rather not do / I'm not really allowed.

Yenthe
on 1/5/15, 8:56 AM

And I'm ofcourse curious about how to do this for future reports I might need to make. There are more times/options where you can use this :)

Yenthe
on 1/5/15, 9:01 AM
2
Akash Balar
On 4/13/16, 7:23 AM

 Hello,

I Think it's helpful for you. 

<div style="position:absolute;top:850px; page-break-inside: avoid;">
     Your Custom Content
</div>

Thanks.

0
Motez
On 4/12/16, 6:46 AM
 <div style="position:absolute; bottom:-xxpx;" >
my custom content
</div>
0
Dr Obx
On 2/9/16, 5:52 AM

If you just want it floating above your current footer, you can create a new class in css, add bottom: xx px; also you can add some transparency and hover to reduce or increase transparency. if you don't want cause any obstructions to see the page content ...

there is a many ways to solve this problem.

0
Sajin Aziz
On 1/5/15, 6:54 AM

   Try this code after <div class="page">... </div>

<div class="footer text-center">
            This is the footer
</div>

@Sajin thanks for the reply and method but sadly this will overwrite the default footer. I've already added a custom footer so I can't use this option :s I really need the content to be right above the footer.

Yenthe
on 1/5/15, 7:13 AM

@yenthe :- Did u got any solution?? I am also facing the same problem.

pks
on 12/15/15, 6:49 AM

@pks nothing would do exactly what I wanted so I decided to take a slightly other approach and just make a hardcoaded div.

Yenthe
on 12/15/15, 7:01 AM

Hello ! I try to make a custom footer ... Can you show your code to see how you did it ? :-)

BHC SPRL, Coralie Cardon
on 2/9/16, 3:50 AM

Your Answer

Please try to give a substantial answer. If you wanted to comment on the question or answer, just use the commenting tool. Please remember that you can always revise your answers - no need to answer the same question twice. Also, please don't forget to vote - it really helps to select the best questions and answers!

About This Community

This community is for professionals and enthusiasts of our products and services. Read Guidelines

Question tools

4 follower(s)

Stats

Asked: 1/5/15, 6:26 AM
Seen: 3663 times
Last updated: 4/13/16, 7:23 AM