[asp.net-mvc]将内容向右对齐 MvcRazorToPdf 库中

标签: PDF Asp.net-MVC
发布时间: 2016/10/9 7:03:35
注意事项: 本文中文内容可能为机器翻译,如要查看英文原文请点击上面连接.

我有以下 view 以生成 PDF 发票使用 MvcRazorToPdf

<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>

以上代码将生成以下 viewpdf

Invoice PDF

但如何就从未停止过我风格上述 divtdinvoice ,我不能够移动 Invoice 文本与右侧的 pdf 。我已经试过添加链接到 bootstrap.css 的也不起作用。有人对此有任何解决办法吗?任何人都曾在造型 pdf MvcRazorToPdf librabry?

解决方法 1:

文本对齐方式被尊重,只是在默认情况下,你表和它的细胞将会自动折叠以适应内容 (可方便地使用您的浏览器工具来检查元素检查)。

给你的表 (或其单元格宽度),例如

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

然而,使用 <table> 元素不是很好的做法 (请参阅为什么不使用表格进行布局在 HTML 中?语义化 HTML + CSS 为什么表不坏 (为布局 *) 相比.)。您可以改用浮动或相对/绝对定位例如

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

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