当自己利用element-ui上面的例子来实现整体布局的时候，

就是自己分开成单独的vue组件时，发现布局是不对的，效果是这样的：

代码是这样的，代码一模一样，只是拆开了各个组件，如下图：

后来发现是这个问题，当你拆开后，el-container容器不知道子元素中是否有 el-header 或 el-footer，

答案在这里

完善答案如图:

el-container 实践上的布局问题的更多相关文章

  1. HTML——上中下布局

    上中下布局是最主要的布局方式,本比如果用户屏幕分辨率为800*600像素. watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQvc3Vuc2h1bWlu/font ...

  2. 记一次小团队Git实践(上)

    公司规模不大,成立之初,选择了svn作为版本控制系统.这对于用惯了git的我来说,将就了一段时间后,极为不爽,切换到git-svn勉强能用.随后,因为产品需要发布不同的版本,而git-svn对远程分支 ...

  3. 使用easyui进行上左右布局

    在后台管理系统开发的过程中,上左右的布局是最常见的页面布局方式,现在我们来看看使用easyui这个jquery前端框架如何快速搭建一个可用的页面框架. 1.在页面中引入easyui所需的文件 1 &l ...

  4. 深入解析SQL Server并行执行原理及实践(上)

    在成熟领先的企业级数据库系统中,并行查询可以说是一大利器,在某些场景下他可以显著的提升查询的相应时间,提升用户体验.如SQL Server, Oracle等, Mysql目前还未实现,而Postgre ...

  5. 《转》ACTIONBAR-PULLTOREFRESHLIBS+沉浸式在部分手机上的布局错乱,目前知道的三星系统（TouchWiz）

    转载:http://www.cnblogs.com/wubingshenyin/p/4413672.html(原文连接) 前段时间看见ActionBar-PullToRefreshLibs用来刷新很好 ...

  6. ActionBar-PullToRefreshLibs+沉浸式在部分手机上的布局错乱,目前知道的三星

    前段时间看见ActionBar-PullToRefreshLibs用来刷新很好看,配合4.4以上支持的沉浸式效果更佳,于是便想配合沉浸式+ActionBar-PullToRefreshLibs做出一个 ...

  7. 小程序 当button遇上Flex布局

    当需要将button按行排列,当超过一行时,可以换行,从左到右排列,想实现如下效果(实现的比较粗糙,能说明问题就行,呵~~~): 使用Flex布局,在设置主轴方向上对齐方式,使用justify-con ...

  8. 1.还不会部署高可用的kubernetes集群?看我手把手教你使用二进制部署v1.23.6的K8S集群实践(上)

    公众号关注「WeiyiGeek」 设为「特别关注」,每天带你玩转网络安全运维.应用开发.物联网IOT学习! 本章目录: 0x00 前言简述 0x01 环境准备 主机规划 软件版本 网络规划 0x02 ...

  9. 鹅长微服务发现与治理巨作PolarisMesh实践-上

    @ 目录 概述 定义 核心功能 组件和生态 特色亮点 解决哪些问题 官方性能数据 架构原理 资源模型 服务治理 基本原理 服务注册 服务发现 安装 部署架构 集群安装 SpringCloud应用接入 ...

随机推荐

  1. fiddler filter过滤+断点

    转自  http://blog.csdn.net/u012808234/article/details/52767470

  2. Spring Boot 是什么？

    Spring Boot 2.0 的推出又激起了一阵学习 Spring Boot 热,那么, Spring Boot 诞生的背景是什么?Spring 企业又是基于什么样的考虑创建 Spring Boot ...

  3. php 字符编码转换

    <?php/** * Created by PhpStorm. * User: yxp * Date: 2016/11/8 * Time: 16:47 */ /** * 将非GBK字符集的编码转 ...

  4. Github SSH key 的配置

    哈喽,新年好呀! 今天我又来更新一点github的内容啦~~ windows版本 一.打开git shell,输入指令操作ssh-keygen -t rsa -C “你的注册邮箱”,然后回车回车回车, ...

  5. ActiveMQ broker 非持久化queue消息的入队、出队和应答

    消息入队:Queue.doMessageSend 消息分发:Queue.doActualDispatch 消息发送:TransportConnection.dispatch broker收到consu ...

  6. xmanager运行报错：bash: /usr/bin/xterm: No such file or directory

    1.原因 xterm没有安装,解决办法是下载然后安装即可. 如果机器可以用yum,则直接使用yum安装xterm即可: yum install -y xterm 如果没有网络,则在某台操作系统大版本相 ...

  7. URL to load resources from the classpath in Java

    In Java, you can load all kinds of resources using the same API but with different URL protocols: fi ...

  8. 由于 Exception.tostring()失败,因此无法打印异常字符串

    console程序执行错误时,不显示异常信息. 解决方法: 在命令行修改显示字符格式  chcp 936

  9. axios API速查表

    原来jq自带ajax方法,但是近期项目用vue,在vue项目中发送ajax请求原来用vue resource,现在更推荐使用axios,因为axios和vue更配! GET 请求 // Make a ...

  10. suffix word cy dom faction ful fold form out1

    1★cy ﹎﹎﹎﹎性质,状态 2★ dom ﹎﹎﹎﹎领域,范围     1★ faction ﹎﹎﹎﹎达到什么样的状态 2★ ful ﹎﹎﹎﹎满,量 *******有~的 3★ fold ﹎﹎﹎﹎双, ...