Where communities thrive


  • Join over 1.5M+ people
  • Join over 100K+ communities
  • Free without limits
  • Create your own community
People
Activity
    Simon Sapin
    @simon:delire.party
    [m]
    Salut @liZe ! Qu’est-ce que tu penses de transférer le dépôt css-parsing-tests vers github.com/CourtBouillon ?
    Guillaume Ayoub
    @liZe
    Salut @simon:delire.party ! Pas de problème, on peut le récupérer si tu veux.
    Lucie Anglade
    @grewn0uille
    Hello @/all ! As it’s soon our 2-year anniversary as CourtBouillon, we launched a survey to know about you and your expectations https://thym.courtbouillon.org/1. It’s opened until October 10th :)
    Ciaran Evans
    @ciaranevans-xydus

    Hey folks, not an issue I don't think so won't raise it yet.

    I'm having some fun where for some reason the HTML preview of my pages seems like the origin is off compared to the PDF output from Weasyprint.

    If the PDF origin for example is 0,0 - I'm seeing the PDF origin in the HTML preview as something like -50,-50. It's like I have to shift up and left in HTML to get to the top left corner in weasyprint PDF...

    Is there something obvious I could be doing wrong? It makes designing pages difficult as I have stuff missing in the HTML preview that lines up fine in the resulting PDF :')

    Guillaume Ayoub
    @liZe
    Hi @ciaranevans-xydus
    There are page margins, that’s why there’s an empty space between your content and the edges of the page
    If you don’t want to use them, you can remove them with @page { margin: 0 } in your CSS
    Ciaran Evans
    @ciaranevans-xydus
    Ah! Nice one @liZe - time to rejig it all now :sweat_smile:
    Ciaran Evans
    @ciaranevans-xydus

    Now I've set margin to 0, I've lost my page numbers :P

    I've got:

    @page {
            margin: 0;
            size: A4;
            @bottom-right-corner {
                content: counter(page);
                color: #2ABADC;
            }
        }
    Guillaume Ayoub
    @liZe
    Of course, if you set a margin of 0, you lose your page margins and thus can’t put the page number in one of them :/
    Ciaran Evans
    @ciaranevans-xydus
    Ah.
    That could be fun
    Guillaume Ayoub
    @liZe
    If you want page numbers, then you want page margins 😀️
    Ciaran Evans
    @ciaranevans-xydus
    Then I lose the HTML 0,0 == PDF 0,0 :laughing:
    Guillaume Ayoub
    @liZe
    You can apply different margin sizes on the different sides if you want
    You can only keep the bottom margin for example, if it’s easier for you
    Ciaran Evans
    @ciaranevans-xydus
    Yeah. That's a good shout. Sorry, I realise this isn't a CSS help thread :P Can you tell I am a backend dev? lol
    Guillaume Ayoub
    @liZe
    No problem 😁️
    (If you remove the right margin, you’ll have to use @bottom-right instead of @bottom-right-corner)
    Ciaran Evans
    @ciaranevans-xydus
    :thumbsup:
    Good shout, merci!
    Guillaume Ayoub
    @liZe
    Avec plaisir !
    Ciaran Evans
    @ciaranevans-xydus
    And a big thank you for the speedy PR as well :heart:
    Lucie Anglade
    @grewn0uille
    Btw, I don’t if you’ve seen it, we launched a survey about WeasyPrint just here https://thym.courtbouillon.org/1 :)
    Ciaran Evans
    @ciaranevans-xydus
    Nice, shall fill it out now!
    Weasyprint was one of the few actual open source licensed libraries we could find
    And I was very glad to go back to python to use it rather than the java day job :')
    Lucie Anglade
    @grewn0uille
    💜 :)
    Ciaran Evans
    @ciaranevans-xydus
    image.png

    Me again with another question :sweat_smile:

    We have table rows with inner tables :grimacing: and on the html preview, I get:

    the above*
    On the PDF, it doesn't seem to respect the spacing
    image.png
    I would expect the columns in the latter image to both take 50% of the right hand column of the main table
    Ciaran Evans
    @ciaranevans-xydus
    ^ A case of pebcak! Just needed to allow word breaking
    Guillaume Ayoub
    @liZe
    :)
    Ciaran Evans
    @ciaranevans-xydus
    Morning folks :D Me again - does weasyprint respect max-height/max-width of images?
    In HTML previews, these tags work, but it seems like the PDF images are always bigger
    image.png
    HTML Preview ^
    image.png
    PDF ^
    With:
    img { max-width: 100%; max-height: 250px; width: auto; height: auto;}
    Guillaume Ayoub
    @liZe
    I think it should work, let me try
    Oh, I think I know what’s happening
    Is the image in a table?
    Ciaran Evans
    @ciaranevans-xydus
    It is
    Guillaume Ayoub
    @liZe
    Then the width of the columns can be different depending on the browser, as it’s not defined by the specification. So, max-width: 100% can give different results, as it depends on the column’s width.
    You can use a smaller max-height if you think that the second photo is too tall.