Strange Alignment for Logout Button

Yii 2.0 General Discussions
1

Hello folks,

First time poster here and brand new Yii user (previously used Codeigniter for about five years). Yii looks like a really cool framework and many congrats and thanks to everyone involved.

I have a problem and I wonder if anyone can help.

I’ve installed brand new versions of Yii2 (the basic template) on two different computers. On both computers the vertical alignment of the Logout(admin) text/button on the top right hand side is… well… off. When you’re not logged in, everything is cool. The buttons look nice. However, when you login in the top right hand side button goes vertically aligned to the top. This means that the ‘logout (admin)’ text is about ten pixels higher than the text on the other buttons.

At first I thought this was a deliberate design feature of Yii, however, none of the tutorials seem to have that issue.

I’ll be glad to provide screenshots or even a video screencast if it helps.

Can anyone offer some help with this? I’m stumped.

Many thanks!

2

Hi Davcon,

The default layout is all bootstrap. You can change it if you go to \views\layouts\main.php and apply any design of your choice.

3

Actually, it is not standard Bootstrap - it is a slight Yii 2 bug - but it is easy enough to fix :)

Instead of using a form, we need to use the data-method=post option:


	echo Nav::widget([

    	'options' => ['class' => 'navbar-nav navbar-right'],

    	'items' => [

        	['label' => 'Home', 'url' => ['/site/index']],

        	['label' => 'About', 'url' => ['/site/about']],

        	['label' => 'Contact', 'url' => ['/site/contact']],

        	Yii::$app->user->isGuest ? (

            	['label' => 'Login', 'url' => ['/site/login']]

        	) : (

            	'<li>' . Html::a('Logout', ['/user/logout'], ['data-method' => 'post']).'</li>'

        	)

    	],

	]);
4

Thank you! That’s awesome.