Я писал CSS для простой страницы и наткнулся на проблему. У меня есть стиль для кода, который делает его простой границей. Проблема в том, что строка переносится внутри этого кода, когда он внутри абзаца. Например, код ниже:
<!DOCYPE html>
<html>
<head>
<meta charset="utf-8"/>
<style type="text/css">
p { text-align: justify; }
code { border: 1px solid black; border-radius: 3px; }
</style>
</head>
<body>
<p>
Here I have a paragraph and a really long code text:
<code>I'm a really long code text with a border.</code>
</p>
</body>
</html>
Когда строка переносится внутри элемента кода, граница останавливается в первой строке и продолжается второй незавершенный в перерыве, что довольно уродливо Я хотел бы сделать так, чтобы строка не могла переноситься внутри элемента кода, как если бы этот элемент обрабатывался как одно слово в абзаце и появлялся полностью на следующей строке; или что граница останавливается при переносе строки и появляется снова при начале следующей строки. Тем не менее, я понятия не имею, как это сделать, и я не нашел ничего похожего на inte rnet, кто-то может мне помочь?