Yich Lin
Yich Lin

Reputation: 435

ASP.NET MVC razor: conditional attribute in CSS block

Can I use if condition in style tag like this?

<style>
    @@media (min-width: 765px) {
    html,body 
       {
        min-width: auto;
        width: 100%;
        @{
            if (ViewBag.type == "pic")
            {
                @:min-height:100vh;
                @:height:auto;
            }
            else {
                @:height: 100vh;
            }
          }
       }
    }
</style>

Or I should use CSS directly in HTML?

Upvotes: 0

Views: 1396

Answers (1)

Mario Lopez
Mario Lopez

Reputation: 1465

You should put your css in css files and target specific classes instead of loading files conditionally. Then you can use Razor to include conditional classes on your tags. Something like:

@{
    var imgType = ViewBag.type == "mobile"?"for-mobile":"for-desktop";
}

<img class="@imgType" src="..."/>

Then in your CSS file:

.for-mobile{
      min-height:100vh;
      height:auto;
}

.for-desktop{
     height: 100vh;
}

Upvotes: 2

Related Questions