Posts

Showing posts with the label Frontend

Can't Change Default Nuxt Favicon

Answer : I found the solution, but it's kind of tricky and it's a little far from logic. the size of the favicon should be 32*32 pixels or nuxt will load the default favicon itself. and about my tries, it's enough to have a file in your static folder and give the path to nuxt.config.js . but I'm still confused with the solution. Have you tried replace type: 'image/x-icon' with type: 'image/png' ? The infos about this attribute and tag generally can be read here nuxt will convert object like { head: { link: [{ rel: 'icon', type: 'image/png', href: '/favicon.png' }] }} to <head> <link rel='icon' type='image/png' href='/favicon.png'> </head> So you can use any attributes listed in the article above.

Align Two Divs Horizontally (one On Extreme Left And The Other On Extreme Right Of Container)

Answer : display:inline-block will not create a float issue so there is no need to add clearfix you can also use overflow:hidden instead of display:inline-block .header { display: inline-block; width: 100%; border: 1px solid red; } .playerOne { float: right; } .playerTwo { float: left; } <div class="header"> <div class="playerOne"> Oli </div> <div class="playerTwo"> Matt </div> </div> make it simple with flex .wrapper{ display: flex; justify-content: space-between } <div class="wrapper"><span>1</span><span>2</span></div> The problem is that you are not targeting the proper inline-block element. :) .header > div{ display: inline-block; } .playerOne{ float:right; }