{"id":14085,"date":"2011-09-05T20:59:57","date_gmt":"2011-09-06T03:59:57","guid":{"rendered":"http:\/\/css-tricks.com\/?page_id=14085"},"modified":"2022-06-13T08:15:34","modified_gmt":"2022-06-13T15:15:34","slug":"orphans","status":"publish","type":"page","link":"https:\/\/css-tricks.com\/almanac\/properties\/o\/orphans\/","title":{"rendered":"orphans"},"content":{"rendered":"\n
In typography terms, an orphan is the first line of a paragraph that is left behind on the old page while the paragraph continues on the next. The For example, if a paragraph can’t fit on one page in its entirety it is split wherever it is possible. In this way single lines of a paragraph can appear on page before it continues on the next page. This is usually unwanted, so many word processors require at least two lines to be left on an old page, instead of one. You can give it either a positive number (where 2 is the default) or Note that the In typography terms, an orphan is the first line of a paragraph that is left behind on the old page while the paragraph continues on the next. The orphan property controls the minimum number of lines of a paragraph that can be left on the old page. This property only affects paged media such as […]<\/p>\n","protected":false},"author":1036,"featured_media":0,"parent":13939,"menu_order":0,"comment_status":"open","ping_status":"closed","template":"page-almanac-single.php","meta":{"_bbp_topic_count":0,"_bbp_reply_count":0,"_bbp_total_topic_count":0,"_bbp_total_reply_count":0,"_bbp_voice_count":0,"_bbp_anonymous_reply_count":0,"_bbp_topic_count_hidden":0,"_bbp_reply_count_hidden":0,"_bbp_forum_subforum_count":0,"sig_custom_text":"","sig_image_type":"featured-image","sig_custom_image":0,"sig_is_disabled":false,"inline_featured_image":false,"c2c_always_allow_admin_comments":false,"footnotes":""},"tags":[],"acf":[],"jetpack-related-posts":[{"id":14140,"url":"https:\/\/css-tricks.com\/almanac\/properties\/w\/widows\/","url_meta":{"origin":14085,"position":0},"title":"widows","date":"September 6, 2011","format":false,"excerpt":"In typography terms, a widow is the last line of a paragraph that is left alone on a new page or in a new column. The widows property in CSS controls the minimum number of lines of a paragraph that can fall to a new page. This property only affects\u2026","rel":"","context":"With 6 comments","img":{"alt_text":"","src":"","width":0,"height":0},"classes":[]},{"id":196786,"url":"https:\/\/css-tricks.com\/almanac\/properties\/t\/text-align-last\/","url_meta":{"origin":14085,"position":1},"title":"text-align-last","date":"February 26, 2015","format":false,"excerpt":"text-align-last lets you control the alignment of the last (or only) line of text right before a forced line break \u2014 for example the end of a paragraph or the line right before a tag. .intro-graph { text-align-last: center; } At the time of this writing, only Mozilla browsers and\u2026","rel":"","context":"With 2 comments","img":{"alt_text":"","src":"","width":0,"height":0},"classes":[]},{"id":203655,"url":"https:\/\/css-tricks.com\/almanac\/properties\/b\/box-decoration-break\/","url_meta":{"origin":14085,"position":2},"title":"box-decoration-break","date":"June 15, 2015","format":false,"excerpt":"The box-decoration-break property lets you control how box decorations are drawn across the fragments of a \"broken\" element. An element can break into fragments at the end of a line, over columns, or at page breaks. .module { box-decoration-break: clone; } The box decoration properties controlled by box-decoration-break are: background\u2026","rel":"","context":"In \"box-decoration-break\"","img":{"alt_text":"","src":"","width":0,"height":0},"classes":[]},{"id":196161,"url":"https:\/\/css-tricks.com\/almanac\/properties\/b\/background-clip\/","url_meta":{"origin":14085,"position":3},"title":"background-clip","date":"February 17, 2015","format":false,"excerpt":"background-clip lets you control how far a background image or color extends beyond an element's padding or content. .frame { background-clip: padding-box; } Values border-box is the default value. This allows the background to extend all the way to the outside edge of the element's border.padding-box clips the background at\u2026","rel":"","context":"In \"background-clip\"","img":{"alt_text":"","src":"","width":0,"height":0},"classes":[]},{"id":350477,"url":"https:\/\/css-tricks.com\/almanac\/properties\/b\/block-size\/","url_meta":{"origin":14085,"position":4},"title":"block-size","date":"August 25, 2021","format":false,"excerpt":"block-size is a CSS logical property that defines the height of an element when the writing-mode is horizontal, or the width of the element when the writing-mode is vertical. .element { block-size: 700px; writing-mode: vertical-lr; } block-size is defined in the CSS Logical Properties and Values Level 1 specification which\u2026","rel":"","context":"Similar post","img":{"alt_text":"","src":"https:\/\/i0.wp.com\/css-tricks.com\/wp-content\/uploads\/2019\/12\/css-tricks-logo-gradient-outline.png?fit=1200%2C600&ssl=1&resize=350%2C200","width":350,"height":200},"classes":[]},{"id":366791,"url":"https:\/\/css-tricks.com\/almanac\/properties\/p\/print-color-adjust\/","url_meta":{"origin":14085,"position":5},"title":"print-color-adjust","date":"July 14, 2022","format":false,"excerpt":"The print-color-adjust CSS property is sort of like a cost-cutting measure when it comes to printing a webpage. You know how you can literally print a webpage on a piece of paper? That\u2019s what we\u2019re talking about. By applying print-color-adjust, we give the browser a \u201chint\u201d for how to handle\u2026","rel":"","context":"Similar post","img":{"alt_text":"","src":"https:\/\/i0.wp.com\/css-tricks.com\/wp-content\/uploads\/2019\/12\/css-tricks-logo-gradient-outline.png?fit=1200%2C600&ssl=1&resize=350%2C200","width":350,"height":200},"classes":[]}],"_links":{"self":[{"href":"https:\/\/css-tricks.com\/wp-json\/wp\/v2\/pages\/14085"}],"collection":[{"href":"https:\/\/css-tricks.com\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/css-tricks.com\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/css-tricks.com\/wp-json\/wp\/v2\/users\/1036"}],"replies":[{"embeddable":true,"href":"https:\/\/css-tricks.com\/wp-json\/wp\/v2\/comments?post=14085"}],"version-history":[{"count":8,"href":"https:\/\/css-tricks.com\/wp-json\/wp\/v2\/pages\/14085\/revisions"}],"predecessor-version":[{"id":366381,"href":"https:\/\/css-tricks.com\/wp-json\/wp\/v2\/pages\/14085\/revisions\/366381"}],"up":[{"embeddable":true,"href":"https:\/\/css-tricks.com\/wp-json\/wp\/v2\/pages\/13939"}],"wp:attachment":[{"href":"https:\/\/css-tricks.com\/wp-json\/wp\/v2\/media?parent=14085"}],"wp:term":[{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/css-tricks.com\/wp-json\/wp\/v2\/tags?post=14085"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}orphan<\/code> property controls the minimum number of lines of a paragraph that can be left on the old page. This property only affects paged media such as
print<\/code>.<\/p>\n\n\n\n
@media print {\n p {\n orphans: 3;\n }\n}<\/code><\/pre>\n\n\n\n
inherit<\/code>.<\/p>\n\n\n\n
orphan<\/code> property does not generally affect non-paged media such as
screen<\/code>. However, browsers supporting both
orphans<\/code> and
columns<\/code> will apply the intended functionality to columns as well. Also, the property only affects block-level elements.<\/p>\n\n\n\n
widows<\/code> = minimum number of lines in a paragraph split on the new<\/strong> page.
orphans<\/code> = minimum number of lines in a paragraph split on the old<\/strong> page.<\/div>\n\n\n\n
Other resources<\/h3>\n\n\n
Browser support<\/h3>\n\n\n
Chrome<\/th> Safari<\/th> Firefox<\/th> Opera<\/th> IE<\/th> Android<\/th> iOS<\/th><\/tr><\/thead> 25+<\/td> None<\/td> None<\/td> 9.2+<\/td> 8+<\/td> None<\/td> None<\/td><\/tr><\/tbody><\/table><\/figure>\n","protected":false},"excerpt":{"rendered":"