-
-
Notifications
You must be signed in to change notification settings - Fork 223
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Let user define margin #29
Comments
As you might notice margin 0 removes the date/time from top. |
@simonschllng Sorry for the delayed response. So you're proposing two different solutions:
If you want to submit a PR for solution 1 I would accept it. That way you can style it however you see fit. As pointed out it was added to remove the time, but I would be willing to allow users to override if it they really want to |
First option is more appropriate. |
Anyone want to take this work on up on the first option? |
I've taken care of this issue by adding a prop called If you want nothing to be there simply:
|
pageStyle not working! I want custom margin top, bottom. pageStyles={'@media print { body { -webkit-print-color-adjust: exact; } @page { size: A4; margin: 200mm !important }}'} |
@NguyenTheSon does it not work in general, or does it just not work with media/other queries? |
@MatthewHerbst all not working! can you help me! |
@gregnb Any concrete solution, on how one can give page margins using |
I got the solution for this, As I was using React, so made a function to get the page margins and called the same inside style tag in the JSX, and it worked,
Hope it helps! |
@nikhils4 thanks for sharing! If you'd like, feel free to make a PR to add that to the CSS tricks section of the README! I'm happy to do that too if you'd like, but would love for you to take the git credit 😄 |
Yeah sure @MatthewHerbst, would be glad to do that 💯 Done, #394 |
Hii ,
Hi @nikhils4 can't we add a margin to the specific page only? As the above function added margin to all pages. |
@15tanvir you'd have to make a class to apply it to and have that class only wrap content on the first page |
Actually the thing is that I want to apply @page property to only specific
page, when the content get increase , it will automatically got break and
append to the next page at that time only the @page margin property needs
to get applied. On the other remaining pages it won't get applied. So I
tried to write the @page in the particular class but it doesn't work.
…On Sat, Jan 14, 2023 at 12:52 AM Matthew Herbst ***@***.***> wrote:
@15tanvir <https://github.com/15tanvir> you'd have to make a class to
apply it to and have that class only wrap content on the first page
—
Reply to this email directly, view it on GitHub
<#29 (comment)>,
or unsubscribe
<https://github.com/notifications/unsubscribe-auth/AYZLXSIWPMOYKLOU3HLTDYLWSGTOLANCNFSM4FHTGV2Q>
.
You are receiving this because you were mentioned.Message ID:
***@***.***>
--
*Tanvir* *Sheikh*
Software Trainee
-
M *+91 8888691390*
E ***@***.*** ***@***.***>*
-
|
If you look at the docs, I think you want something like: @page :first {
/* Applies styles to the first page only */
} |
|
A printer usually cannot print to the very edge of the paper. This library however sets the page margins to 0 here:
https://github.com/gregnb/react-to-print/blob/725e060ed02a6077420f5be2897990b60f9ee46a/src/index.js#L162
What is the reason for that? It causes my page to look ugly and cuts away some part of the text. Can we make this style optional or over-writable by a prop?
The text was updated successfully, but these errors were encountered: