1
Well, I’ve tested it in various ways, changing the element span
for h6
, for strong
, and others, and nothing! There was no way, until now, to format the width
and height
of an element within the tag <p>
. Does CSS not accept, is that it? Or what is missing?. Follow the code:
PS: realize that my intention is to leave the number "1" in a circle/box with 30x30px, that’s all.
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<link href="https://fonts.googleapis.com/css?family=Lobster+Two&display=swap" rel="stylesheet">
<style>
p {
font-family: 'Lobster Two', cursive; font-size:18pt;
}
.x {
width:30px; height:30px; border:1px solid black; line-height:30px; border-radius:50%;
}
</style>
</head>
<body>
<div>
<p><span class="x">1</span>A raposa lançou-se esbaforida sobre o pássaro.</p>
</div>
</body>
</html>
You are trying to put width on an inline element. if you put a
display:inline-block;text-align:center;
in the.x
or evendisplay:block
, will change the behavior of the widget. Oinline-block
is more interesting in this case.– Bacco