Flexbox wkhtmltopdf渲染問題

Question

我有一個頁面，我正在變成一個pdf與wkhtmltopdf。我有一個3列布局，它在Chrome中運行良好，但是pdf生成不正確。有沒有其他的flexbox可以提供相同的視圖或使用wkhtmltopdf製作flexbox的方法？ Modernizr沒有幫助。謝謝。

HTML：

<div class="header"> 
    <div id="name" class="center"> 
    <h2> 
     Centered Text 
    </h2> 
    </div> 
    <div id="links" class="left"> 
    <h3> 
    Left Line 1 
    <br> 
    Left Line 2 
    </h3> 
    </div> 
    <div id="contact" class="right"> 
    <h3> 
    Right Line 1 
    <br> 
    Right Line 2 
    </h3> 
    </div> 
</div> 
</div class="clear"></div> 

CSS：

.header { 
    margin-top: 0; 
    margin-bottom: 2px; 
    display: flex; 
    justify-content: space-between; 
} 

.center { 
    order: 2; 
    text-align: center; 
} 

.left { 
    order: 1; 
    float: left; 
    text-align: left; 
} 

.right { 
    order: 3; 
    float: right; 
    text-align: right; 
} 

.clear:before, 
.clear:after { 
    flex-basis: 0; 
    order: 1; 
} 

.clear { 
    clear: both; 
} 

Answer 1

wkhtmltopdfuses an old version of WebKit，所以你必須使用the original Flexbox spec，這是遠不一樣強大，但仍然可以做一些由於相同的效果。

另請注意，您必須在-webkit-前綴大量屬性。