див footer незнаю почему лезет в верх

Общие вопросы по использованию второй версии фреймворка. Если не знаете как что-то сделать и это про Yii 2, вам сюда.
Ответить
riaron
Сообщения: 84
Зарегистрирован: 2018.12.04, 14:12

див footer незнаю почему лезет в верх

Сообщение riaron »

див footer незнаю почему лезет в верх
вот страница:

Код: Выделить всё

<?php
use yii\base\Widget;
/* @var $this \yii\web\View */
/* @var $content string */

use app\widgets\Alert;
use yii\helpers\Html;
use yii\bootstrap\Nav;
use yii\bootstrap\NavBar;
use yii\widgets\Breadcrumbs;
use app\assets\AppAsset;
use yii\helpers\Url;
use app\models\InputFormAuth;

AppAsset::register($this);
?>
<?php $this->beginPage() ?>
<!DOCTYPE html>
<script type="text/javascript" src="https://www.google.com/jsapi"></script>
<script src="http://www.google.com/uds/solutions/dynamicfeed/gfdynamicfeedcontrol.js"
type="text/javascript"></script>


<script type="text/javascript">
function load() {
var feed ="http://feeds.bbci.co.uk/news/world/rss.xml";
new GFdynamicFeedControl(feed, "feedControl");

}
google.load("feeds", "1");
google.setonloadCallback(load);
.box {
	transform: translateY(100vh);
	animation: floatUp 4s linear infinite alternate;
}
@keyframes floatUp {
	0% {
		transform: translateY(20vh);
	}
	100% {
		transform: translateY(-20vh);
	}
}
.boxouter {
	display: inline-block;
	position: relative;
	animation: wiggle 1s ease-in-out infinite alternate;
}
@keyframes wiggle {
	0% {
		transform: translateX(-50px);
	}
	100% {
		transform: translateX(50px);
	}
}
.goo-defs {
	//display: none;
	width: 0;
	height: 0;
}
h1 {
	width: calc(100% - 400px);
	text-align: center;
	position: absolute;
	top: 30vh;
	color: #fff;
	font: 700 120px/120px 'Orbitron', sans-serif;;
	text-shadow: 0px 0px 4px #ffffff;
}

</script>
<svg class="goo-defs" xmlns="http://www.w3.org/2000/svg" version="1.1">
	<defs>
		<filter id="goo">
			<feGaussianBlur in="SourceGraphic" stdDeviation="10" result="blur" />
			<feColorMatrix in="blur" mode="matrix" values="1 0 0 0 0  0 1 0 0 0  0 0 1 0 0  0 0 0 19 -9" result="goo" />
			<feComposite in="SourceGraphic" in2="goo" operator="atop"/> 
		</filter>
	</defs>
</svg>
<html lang="<?= Yii::$app->language ?>">
<head>
    <meta charset="<?= Yii::$app->charset ?>">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <?= Html::csrfMetaTags() ?>
    <title><?= Html::encode($this->title) ?></title>
    <?php $this->head() ?>
</head>

<?php $this->beginBody() ?>


<div class="wrap">
<?
if(Yii::$app->user->identity->role=='admin'){
    $a=true;
}
 NavBar::begin([
        'brandLabel' => Yii::$app->name,
        'brandUrl' => Yii::$app->homeUrl,
        'options' => [
            'class' => 'navbar-inverse navbar-fixed-top',
        ],
    ]);
        echo Nav::widget([
        'options' => ['class' => 'navbar-nav navbar-right'],
        'items' => [
        ['label' => 'Авто', 'url' => ['/site/cars']],
        ['label' => 'Корзина', 'url' => ['/site/baskets']],
        ['label' => 'Поиск', 'url' => ['/site/search']],
        ['label' => 'Регистрация', 'url' => ['site/signup'], 'visible' => Yii::$app->user->isGuest],
        Yii::$app->user->isGuest ? (
        ['label' => 'Войти', 'url' => ['/site/login']]
        ) : (
        '<li>'. Html::beginForm(['/site/logout'], 'post'). Html::submitButton(
            'Выйти ('. Yii::$app->user->identity->username .')',
            ['class' => 'btn btn-link logout','style' => ['height' => '50px', 'text-decoration' => 'none', ]]
            )
            . Html::endForm()
            . '</li>'
        ),
            $a ?(['label' => 'Админка', 'url' => ['/site/admin']]):('<li></li>'),

        ],
        ]);
      NavBar::end(); ?>
  <br>
    <div class='left'>
    <div class="container">



</div>

        <div class="middle"><?= $content ?></div>

    </div>

<div class='footer'>
<?/*
    $urla =Url::toRoute(['/site/about']);
    $urlc =Url::toRoute(['/site/contacts']);
    $urll =Url::toRoute(['/site/links']);
	echo "<div style='margin-left:20px;'><strong>
		<a href='".$urla."'  style='color:yellow'>О Компании</a><br>
		<a href='".$urlc."' style='color:yellow'>Контакты</a><br>
		<a href='".$urll."' style='color:yellow'>Ссылки</a><br></strong>

	";</div>*/

?>


</div>

</div>

<?php $this->endBody() ?>

</html>
<?php $this->endPage() ?>

вот стили

Код: Выделить всё

div.left{
    float:left;
	width:200px;
}
div.footer {
	 float:left;
	width:100%;
}
div.middle{
	background-image: url('../../web/files/background/back.jpg');
	background-size:cover;
     height:550px;
    width:840px;
    position: absolute;
    left:450px;
    top:120px;
    float:left;
}
div.conteiner{
	width:1170px;
	height:1690px;
}
в чем проблема?

yiiliveext
Сообщения: 910
Зарегистрирован: 2019.08.13, 01:49

Re: див footer незнаю почему лезет в верх

Сообщение yiiliveext »

А тег body где потерялся?

riaron
Сообщения: 84
Зарегистрирован: 2018.12.04, 14:12

Re: див footer незнаю почему лезет в верх

Сообщение riaron »

вставил боди не помогло
вот картинка
Изображение

unknownby
Сообщения: 334
Зарегистрирован: 2019.11.05, 16:34
Контактная информация:

Re: див footer незнаю почему лезет в верх

Сообщение unknownby »

А ты правильно скопил CSS ? У тебя же container

Код: Выделить всё

div.conteiner{
	width:1170px;
	height:1690px;
}

riaron
Сообщения: 84
Зарегистрирован: 2018.12.04, 14:12

Re: див footer незнаю почему лезет в верх

Сообщение riaron »

Удалил css непомогло

unknownby
Сообщения: 334
Зарегистрирован: 2019.11.05, 16:34
Контактная информация:

Re: див footer незнаю почему лезет в верх

Сообщение unknownby »

По верстке визуально всё правильно, нужно разбираться с CSS

riaron
Сообщения: 84
Зарегистрирован: 2018.12.04, 14:12

Re: див footer незнаю почему лезет в верх

Сообщение riaron »

вот полный css

Код: Выделить всё

html,
body {
    
}
td >a{
	color:yellow;
}
td{
		text-align:left;
	padding-left:5px;
}
.wrap {
    min-height: 100%;
    height: auto;
    margin: 0 auto -60px;
    padding: 0 0 60px;
	float:left;
}

.wrap > .container {
    padding: 70px 15px 20px;
}
img.carticon{
	height:12px;
	width:12px;
}
.footer {
    height: 60px;
    background-color: #f5f5f5;
    border-top: 1px solid #ddd;
    padding-top: 20px;
}

.jumbotron {
    text-align: center;
    background-color: transparent;
}

.jumbotron .btn {
    font-size: 21px;
    padding: 14px 24px;
}

.not-set {
    color: #c55;
    font-style: italic;
}


/*my*/
body{
    background: url('../../web/files/background/background.gif');
	background-size:cover;
}
div.sort{margin-left:150px;}
div.sort > a{
	color:white;
}
div.topmen{
	width:100%;
    top:50px;
    color:white;
    background-color: black;
    padding-top:5px;
    padding-bottom:5px;
    padding-left:3px;
    padding-right:500px;
    border: 2px solid green;
    z-index:2;

}

a.topmen:hover{
    bacground-color:red;
}
div.product{
    float:left;
	height: 250px;
    width:200px;
    border:1px solid black;
    background-color: dimgrey;
	border-radius:50px;
    margin:10px;

}

div.productdesc > a{
    color: white;
}
div.productdesc{
		text-align:center;

	width:200px;
	height:100px; 	
}
div.top{
    float:left;
    position: relative;

}
div.left{
    float:left;
	width:200px;
}
div.middle{
	background-image: url('../../web/files/background/back.jpg');
	background-size:cover;
     height:550px;
    width:840px;
    position: absolute;
    left:450px;
    top:120px;
    float:left;
}
img.wphoto{
    height: 150px;
    width:200px;
	border:1px solid black;
	border-radius:50px;
	
}

div.pagination{
    position:absolute;
    top:570px;
    left:250px;
	width:160px;
	height:50px;
}
table.basket{
    color:white;
    border:1px solid yellow;
}
div.amenu{
    position: absolute;
    left:200px;
    color: White;
    font-size: 16px;

}
a.amenu{
    color: White	;
    font-size:22px;
    font-weight: bold;
}

#inputform{
    color: firebrick;
    left:150px;
    top:0px;
    font-size: 16px;
    line-height: 1;
   

}
div.cosmo{
    float:l;
    border: 6px double #122b40;
    font-size: 16px;
    font-weight: bold;
    color: firebrick;
    background-color: #1a1a1a;


}
div.basket{
     left: 0px;
    font-size: 16px;
    font-weight: italic;
    color: firebrick;
    text-align: center;
}
div.about{
    color:yellow;
    border:3px solid black;
	border-radius:30px;
    background-color: dimgrey;
    width:100%;
    height:400px;
    text-align: center  ;
}
div.about > a{
    color: yellow;
}
a.yellow{
    color: yellow;
}
a.delete{
    border:3px solid black;
	color:red;
}
a.plmi{
    padding-left: 2px;
    padding-right: 2px;
    color:yellow;
    font-size: 16px;
    border:2px solid black;
    background-color:green;

}
div#phone{
	color:green;
    }
div.outp{
    float:left;
}


div.news {
border-right:1px solid white;
	width:200px;
	height:300px;
}
div.footer {
	 float:left;
	width:100%;
}
 
div.m10{
    margin-top:10px;
    color:white;
    text-align:justify ;
}
div.h1 {
	text-align:center;
}

unknownby
Сообщения: 334
Зарегистрирован: 2019.11.05, 16:34
Контактная информация:

Re: див footer незнаю почему лезет в верх

Сообщение unknownby »

riaron писал(а):
2020.03.19, 10:36
вот полный css
Мне не нужен полный CSS, мне нужно чтобы ты залез в дебагер хрома и там возился с CSS, пока не поймешь ошибку свою.
В том, что где-то ты упустил размеры блоков и слишком заигрался с float.
Если бы у тебя были дивы header, content, footer и ширина блоков была 100%, то никаких проблем не было бы с версткой, а значит где-то див content потерял свои размеры и блок footer переехал к header-у.

Ответить