Question 189203 in Laravel Question posted in
The official Laravel Documentation can be found here.

How to fix whitespace when creating Laravel title?

I created such a field in my Laravel app.blade.php file.

<h1>@yield('heading')</h1>

I use this in my about.blade.php file as follows. (phpstorm default spacings)

@section('heading')
     TEST HEADING
@endsection

And I get an output like this. There’s a lot of space and slack. If I write them side by side, I get a result like this;

<h1> TEST HEADING

</h1>

or such a result if i write no-space

TEST HEADING@endsection

What solution can be produced for this to be gapless and smooth?

Tags:

3

Answers


  1. Chosen as BEST ANSWER
    0

    I guess I should use tags in about.blade.php file.

    @section('notice')
<h1>HEADING</h1>
@endsection

    It seems to be resolved when I do this.


  2. 0

    You could write strings in this format:

    @section('heading')      

   {{ 'TEST HEADING' }} 

@endsection

    You could find more details here: https://laravel.com/docs/10.x/blade#displaying-data

    Login or Signup to reply.
  3. 0

    To ensure that there are no extra spaces or gaps around your heading when using the @yield and @section directives in Laravel’s Blade templates, you can use the @php directive to write the heading without any extra whitespace or line breaks.

    Here’s an example of how you can modify your code to achieve a gapless and smooth heading:

    In app.blade.php:

    <h1>@yield('heading')</h1>

    In about.blade.php:

    @section('heading')
    @php
        echo 'TEST HEADING';
    @endphp
@endsection

    By using the @php directive, you can write the heading directly without any extra spaces or line breaks. This will ensure that the output is gapless and smooth.

    Alternatively, if you prefer to use Blade syntax instead of the @php directive, you can use the {{ }} tags to output the heading without any spaces:

    In about.blade.php:

    @section('heading')
    {{ 'TEST HEADING' }}
@endsection

    Both of these approaches will produce the desired result with a gapless and smooth heading.

    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search