Компоненты и слоты Laravel Blade: содержимое слотов не отображается рядом друг с другом

Я работаю с блейд-компонентами, и у меня есть компонент с двумя слотами. Я хочу передать изображение в первый слот и текст во второй. Они должны отображаться рядом друг с другом, но отображаются в отдельных строках.

фрагмент кода слотов:

<h1>
    {{ $icon }} {{ $title }}
</h1>

фрагмент кода заполнения слотов:

@component('components.pageheader')
       @slot('icon')
            <img src = "{{ asset('img/an_image.png') }}" width = "28px" height = "28px">
       @endslot
       @slot('title')
            myTitle
       @endslot
@endcomponent

Что мне не хватает?

Попробуйте style = "display:inline-block; margin-right:10px;" на теге <img>

— 11.12.2020 10:24

Спасибо! Это работает. Я поместил тег <img> в <div style = "display:inline-block margin-right:10px>". Если хотите, опубликуйте его как ответ, и я приму его!

— 11.12.2020 10:32

Опубликовали как ответ, как было предложено, в интересах последующих посетителей

— 11.12.2020 10:39

laravel laravel-blade

11.12.2020 10:16

Стоит ли изучать PHP в 2023-2024 годах?

Привет всем, сегодня я хочу высказать свои соображения по поводу вопроса, который я уже много раз получал в своем сообществе: "Стоит ли изучать PHP в...

Оживление вашего приложения Laravel: Понимание режима обслуживания

Здравствуйте, разработчики! В сегодняшней статье мы рассмотрим важный аспект управления приложениями, который часто упускается из виду в суете...

Коллекции в Laravel более простым способом

Привет, читатели, сегодня мы узнаем о коллекциях. В Laravel коллекции - это способ манипулировать массивами и играть с массивами данных. Благодаря...

Поиск нового уровня в Laravel с помощью MeiliSearch и Scout

Laravel Scout - это популярный пакет, который предоставляет простой и удобный способ добавить полнотекстовый поиск в ваше приложение Laravel. Он...

Освоение архитектуры микросервисов с Laravel: Лучшие практики, преимущества и советы для разработчиков

В последние годы архитектура микросервисов приобрела популярность как способ построения масштабируемых и гибких приложений. Laravel , популярный PHP...

Как построить CRUD-приложение в Laravel

Laravel - это популярный PHP-фреймворк, который позволяет быстро и легко создавать веб-приложения. Одной из наиболее распространенных задач в...

1 081

Перейти к ответу Данный вопрос помечен как решенный

Ответы 1

Ответ принят как подходящий

Попробуйте установить display:inline-block в div-оболочке для img, как показано ниже.

@component('components.pageheader')
       @slot('icon')
            <div style = "display:inline-block; margin-right:10px">
                <img src = "{{ asset('img/an_image.png') }}" width = "28px" height = "28px">
            </div>
       @endslot
       @slot('title')
            myTitle
       @endslot
@endcomponent

11.12.2020 10:37

Другие вопросы по теме

Компонент блейда уведомлений электронной почты Laravel не отображается должным образом

Laravel: передать переменную в подкомпонент Blade

Как показать атрибуты продуктов в файле блейда (цвет, размер и т. д.) в Laravel?

В laravel, как объявить глобальные переменные доступными для всех файлов лезвий?

Использование пагинации с коллекциями в laravel 9

Как напечатать пару значений ключа в Laravel, используя цикл foreach

Laravel 9 выдает собственное представление ошибок, если соединение с БД не удается?

Я не могу войти в свою учетную запись администратора в проекте laravel. Я ЗНАЮ, что детали верны. Использование Таблицы Плюс

Многоразовый компонент Livewire + лезвие

Присоединение метода PUT к скрипту в файле блейда

Компоненты и слоты Laravel Blade: содержимое слотов не отображается рядом друг с другом

Ответы 1

Другие вопросы по теме

Похожие вопросы