With a DIV, containing a P, that has a border-radius of 50% is there a
way to make sure the text doesn't go over the radius (ie. look like it extends beyond the sides of the DIV) without having to set up a
shape-outside polygon (or multi little DIVs)?
Andrew Poulos <ap_prog@hotmail.com> wrote on 29 Jun 2020 in comp.infosystems.www.authoring.stylesheets:
With a DIV, containing a P, that has a border-radius of 50% is there a
way to make sure the text doesn't go over the radius (ie. look like it
extends beyond the sides of the DIV) without having to set up a
shape-outside polygon (or multi little DIVs)?
overflow: hidden;
On 29/06/2020 9:53 pm, Evertjan. wrote:
Andrew Poulos <ap_prog@hotmail.com> wrote on 29 Jun 2020 in
comp.infosystems.www.authoring.stylesheets:
With a DIV, containing a P, that has a border-radius of 50% is there a
way to make sure the text doesn't go over the radius (ie. look like it
extends beyond the sides of the DIV) without having to set up a
shape-outside polygon (or multi little DIVs)?
overflow: hidden;
;-)
Still I find it lamentable that text gets cut off by a border radius.
Still I find it lamentable that text gets cut off by a border radius.
On 29/06/2020 23:59, Andrew Poulos wrote:
[ img attached ] <https://i.imgur.com/KlMk7fM.png>
Still I find it lamentable that text gets cut off by a border radius.
=?UTF-8?B?8J+YiSBHb29kIEd1eSDwn5iJ?= <Hello.World@example.com> wrote on 02 Jul 2020 in comp.infosystems.www.authoring.stylesheets:
On 29/06/2020 23:59, Andrew Poulos wrote:
[ img attached ] <https://i.imgur.com/KlMk7fM.png>
Still I find it lamentable that text gets cut off by a border radius.
Try:
<style>
body {
background:#333;
}
pre {
--diam:950px;
box-sizing: border-box;
border: 2px solid yellow;
border-radius: 50%;
text-align:center;
width:var(--diam);
height:var(--diam);
background:black;
color:white;
font-size:22pt;
padding-top:90px;
overflow:hidden;
}
</style>
<pre>
Lorem ipsum
dolor sit amet,
consectetur adipiscing elit,
sed do eiusmod tempor incididunt
Ut labore et dolore magna aliqua.
Ut enim ad minim veniam, quis nostrud
exercitation ullamco laboris nisi ut aliquit
ex ea commodo consequat. Duis aute irure dolor
in reprehenderit in voluptate velit esse cillum
dolore eu fugiat nulla pariatur. Excepteur
sint occaecat cupidatat non proident,
sunt in culpa qui officia deserunt
mollit anim id est laborum.
At vero eos et accusamus et iusto odio dignissimos
ducimus qui blanditiis praesentium voluptatum
deleniti atque corrupti quos
dolores et quas molestias
excepturi sint occaecati
cupiditate non provident,
similique sunt
in culpa.
</pre>
Sysop: | Keyop |
---|---|
Location: | Huddersfield, West Yorkshire, UK |
Users: | 292 |
Nodes: | 16 (2 / 14) |
Uptime: | 193:06:57 |
Calls: | 6,616 |
Files: | 12,166 |
Messages: | 5,315,306 |