Страница 2 из 2 < 1 2
Показывать 40 сообщений этой темы на одной странице

Javascript-форум (https://javascript.ru/forum/)
-   Общие вопросы Javascript (https://javascript.ru/forum/misc/)
-   -   Как удалить пустое пространство в текстовых блоках? (https://javascript.ru/forum/misc/85147-kak-udalit-pustoe-prostranstvo-v-tekstovykh-blokakh.html)

webgraph 21.04.2023 12:59
Цитата:
Сообщение от ksa (Сообщение 551594)
Если самому расставлять переносы (<br />) - табличка может "убирать" или "обтекать" текст...

<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8">
    <title>Text Trim</title>
<style>
    .container {
        display: block;
        width: 100%;
        float: left
    }
    .text {
        font-size: 17px;
        line-heigth: 20px;
        color: #fff;
        background-color: blue;
        max-width: 188px;
        margin-bottom: 1px;
        float: right;
    }
</style>
</head>

<body>

    <div class="container">
        <table class="text">
            <td>Quisque malesuada<br />placerat nisl. Nulla<br />consequat massa quis<br />enim!</td>
        </table>
    </div>

</body>
</html>
Что ты за прЕколист? Это должно происходить автоматически.

voraa 21.04.2023 13:01
Вряд ли получится.
Там алгоритмы рендеринга такие.
Сначала впихивается текст и блок расширяется до максимально возможного, потом уже с учетом этой ширины делаются переносы. Но ширина остается той, что высчитали вначале.

ksa 21.04.2023 13:03
webgraph, если расстановка переносов не выход - можно использовать "обратное" действо - расстановка непереносимых пробелов! :)

<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8">
    <title>Text Trim</title>
<style>
    .container {
        display: block;
        width: 100%;
        float: left
    }
    .text {
        font-size: 17px;
        line-heigth: 20px;
        color: #fff;
        background-color: blue;
        max-width: 188px;
		width: min-content;
        display: inline-block;
        margin-bottom: 1px;
        float: right;
    }
</style>
</head>

<body>

    <div class="container">
        <div class="text">
            Quisque&nbsp;malesuada placerat&nbsp;nisl.&nbsp;Nulla consequat&nbsp;massa&nbsp;quis enim!
        </div>
    </div>

</body>
</html>

ksa 21.04.2023 13:04
Цитата:
Сообщение от webgraph
Это должно происходить автоматически.
Тогда вынужден тебя расстроить... "Голым" css такое вряд ли сотворить. :(

webgraph 21.04.2023 13:07
Цитата:
Сообщение от ksa (Сообщение 551601)
Тогда вынужден тебя расстроить... "Голым" css такое вряд ли сотворить. :(
Именно поэтому мной и было написано сюда, для реализации на JS)) чистом JS.

Просто вдруг кто-то знает что есть возможность на CSS. Но видимо на CSS её реально нет...


Часовой пояс GMT +3, время: 10:30.
Страница 2 из 2 < 1 2
Показывать 40 сообщений этой темы на одной странице