CODEWITHSUNDEEP
asp.net-mvcpdfmvcrazortopdf
Guruprasad J Rao
Guruprasad J Rao

Reputation: 29683

Align contents to right in MvcRazorToPdf library

I have below view which generates PDF invoice using MvcRazorToPdf library

<table border="0">
    <tr>
        <td>
            <h1>Company Name </h1>
        </td>
        <td>
            <div style="text-align:right;margin-right:0px;">
                Invoice
            </div>
        </td>
    </tr>
</table>
<hr/>
<div>
    @Model.InvoiceNum
</div>

Above code generates below view in pdf

Invoice PDF

But how much ever I style the above div within td for invoice, I am not able to move the Invoice text to the right side of the pdf. I've tried adding link to bootstrap.css which doesn't work either. Anyone have any solution for this? Has anyone worked on styling the pdf with MvcRazorToPdf librabry?

Upvotes: 1

Views: 1579

Answers (1)

user3559349
user3559349

Reputation:

Your text alignment is being respected, its just that by default, you table and its cells will be collapsed to fit the content (easy to check by using your browser tools to inspect the elements).

Give your table (or its cells a width), for example

<table style="width:100%;">

However, using <table> elements is not good practice (refer Why not use tables for layout in HTML? and Why Tables Are Bad (For Layout*) Compared to Semantic HTML + CSS.). Instead you can use floats or relative/absolute positioning, for example

<div style="position:relative;">
    <h1>Company Name</h1>
    <span style="position:absolute;right:0;bottom:0">Invoice</span>
</div>

or

<div>
    <h1 style="display:inline-block">Company Name</h1>
    <div style="float:right;margin-top:40px;">Invoice</div>
</div>

Upvotes: 1

Related Questions