Yii2 - DetailView 小部件向左浮动 [英] Yii2 - DetailView widget float left

问题描述

我试图通过应用新的 css 类来覆盖对 DetailView 小部件的处理，但没有成功.我希望 DetailView 小部件的多个实例中显示的所有记录并排显示.我在 appwebcss 中创建了一个名为 detail1-view 的类，并将其应用到 vendor 文件夹中的 detaiview.php.该类中包含 float:left 或 display:inline-block，但没有任何属性起作用.

我的详细视图是:

$模型，'属性' =>[//'标题','通知',//cria um array com a fotografia, em que//carrega a path no campo fieldName da bd['属性'=>'fotodir','值'=>$model->fotodir,'格式' =>['图像', ['width'='230','height'='200']],],],]) ?>

和我的 detailview.php 在文件夹 vendor/yiisoft/yii2/widgets/... 中有 detail1-view 类在正确的地方:

public $options = ['class' =>'detail1-view'];

我的 CSS:

.detail1-view {显示:内联块；宽度:30%；边框:1px 实心 #000;}

DetailView 继续显示一个在另一个顶部而不是并排显示.

有人对这个问题有解决方案吗?

解决方案

我自己解决的.

诀窍是创建另一个带有 position:relative 的类；并将 detailview 小部件放入其中.

这是视图的代码:

<?= DetailView::widget(['模型' =>$模型，'选项' =>['类' =>'detail1-view'],'属性' =>[//'标题','通知',//cria um array com a fotografia, em que carrega a path no campo fieldName da bd['属性'=>'fotodir','值'=>$model->fotodir,'格式' =>['图像',['width'='230','height'='200']],],],]) ?>

以及在 app/web/css 中使用的 css 样式:

.detail-disposal{位置:相对；宽度:100%；}

DetailView CSS:

.detail1-view {左边距:20px；底边距:20px；向左飘浮;宽度:300px；边框:1px 实心 #000;}

现在，每次调用模型时，detailview 小部件都会并排显示.

I'm trying to override the disposal of the DetailView widget by applying new css class but with no luck. I want all the records shown in the several instances of a DetailView widget to appear side by side. I create a class in appwebcss called detail1-view and apply it to the detaiview.php in vendor folder. The class has float:left, or display:inline-block in it, but none of the attributes work.

My Detailview is:

<?= DetailView::widget([
    'model' => $model,
    'attributes' => [
      //'titulo',
      'noticia',
        // cria um array com a fotografia, em que
        // carrega a path no campo fieldName da bd
        [
            'attribute'=>'fotodir',
            'value'=>$model->fotodir,
            'format' => ['image', ['width'=>'230','height'=>'200']],
        ],
    ],
]) ?>

and my detailview.php in folder vendor/yiisoft/yii2/widgets/... has in it the detail1-view class in the right place:

public $options = ['class' => 'detail1-view'];

My CSS:

.detail1-view {
    display: inline-block;
    width: 30%; 
    border:1px solid #000;
}

The DetailView continues to display one in top of another and not side by side.

Anybody has a solution for this issue ?

解决方案

I solved it by myself.

The trick was to create another class with position:relative; and put the detailview widget inside it.

Here's the code for the view:

<div class="detail-disposal">
<?= DetailView::widget([
    'model' => $model,
    'options' => ['class' => 'detail1-view'],
    'attributes' => [
      //'titulo',
      'noticia',
        // cria um array com a fotografia, em que carrega a path no campo fieldName da bd
        [
        'attribute'=>'fotodir',
        'value'=>$model->fotodir,
        'format' => ['image',['width'=>'230','height'=>'200']],
        ],
    ],
]) ?>

and the css style used in app/web/css:

.detail-disposal{
    position:relative;
    width:100%;
}

DetailView CSS:

.detail1-view {
    margin-left:20px;
    margin-bottom:20px;
    float:left;
    width: 300px; 
    border:1px solid #000;
}

Now the detailview widget appears side by side every time a model is called.

这篇关于Yii2 - DetailView 小部件向左浮动的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！