Home > Net >  simple inline css in blade not working properly
simple inline css in blade not working properly

Time:08-26

so this is the CSS:

.header-inner {
    background: url(../images/inner_bg.png), linear-gradient(108deg, #001a30, rgba(0, 0, 0, 0)) no-repeat;
}

i want to inline it to make the background a dynamic value with the blade syntax later on, this is what i did but its not showing the image properly:

<div  style="background: url({{ asset('test-images/inner_bg.png') }}) linear-gradient(108deg, #001a30, rgba(0, 0, 0, 0)) no-repeat">

CodePudding user response:

You can try this:

style="background: url('{{ asset('test-images/inner_bg.png') }}')

CodePudding user response:

The correct code should be like this:

<div  style="background: url('{{ asset('test-images/inner_bg.png') }}') linear-gradient(108deg, #001a30, rgba(0, 0, 0, 0)) no-repeat">

The URL should be inside single quotes.

You can also try this:

@php
$bgUrl = asset('test-images/inner_bg.png');
@endphp

<div  style="background: url('{{ $bgUrl }}') linear-gradient(108deg, #001a30, rgba(0, 0, 0, 0)) no-repeat">
  • Related