Css 移除Joomla中自动添加的包装?
我有一个布局,使用100%的高度div。然而,当我添加页脚时,它会跳到第一个DIV,并在它中间的某个地方浮动。我看了看代码,似乎是这样的。articleBody和item page是我的子DIV的父级,但根据inspector,它们只包装了第一个DIV(所有DIV都在容器中,DOM树将我的100%高度DIV作为子级) 我尝试过使用绝对位置,给页脚一个高度,并试图将其压到底。它只会将其强制到第一个100%高度DIV的底部 我现在唯一的想法是是否可以删除.articleBody和item页面来解决这个问题?如果他们只包装第一个DIV,那么.container流体可能是唯一的父对象,而页脚可以放在底部。如果其他人有其他解决方案,我洗耳恭听,我只需要解决这个问题,因为它被拖了一段时间。作为记录,我正在成功加载引导3 谢谢大家! HTML-INDEX.PHPCss 移除Joomla中自动添加的包装?,css,twitter-bootstrap,joomla,Css,Twitter Bootstrap,Joomla,我有一个布局,使用100%的高度div。然而,当我添加页脚时,它会跳到第一个DIV,并在它中间的某个地方浮动。我看了看代码,似乎是这样的。articleBody和item page是我的子DIV的父级,但根据inspector,它们只包装了第一个DIV(所有DIV都在容器中,DOM树将我的100%高度DIV作为子级) 我尝试过使用绝对位置,给页脚一个高度,并试图将其压到底。它只会将其强制到第一个100%高度DIV的底部 我现在唯一的想法是是否可以删除.articleBody和item页面来解决这
<div class="container-fluid">
<nav class="navbar" role="navigation">
<div class="navbar-header">
<button type="button" class="navbar-toggle"
data-toggle="collapse"
data-target=".navbar-collapse">
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
</div>
<div class="collapse navbar-collapse">
<jdoc:include type="modules" name="nav" style="html5" />
</div>
</nav>
<jdoc:include type="message" />
<jdoc:include type="component" />
<!--END CONTAINER-->
</div>
<footer>
<div class="container">
<div class="row footer-container footer-row">
<div class="col-sm-3">
<div class="footer-logo">Logo</div>
</div>
<div class="col-sm-9">
<p class="footer-about">
About
</p>
<p class="footer-text">
Footer content here
</p>
</div>
<div class="col-sm-3">
<p class="footer-about">
Contact Info
</p>
</div>
</div>
</div>
</footer>
我找到的唯一方法是更改核心代码。这很容易,但是从Joomla更改核心文件从来都不是一件好事 该文件位于:
/components/com_content/views/article/tmpl/default.php我找到的唯一方法是更改核心代码。这很容易,但是从Joomla更改核心文件从来都不是一件好事 该文件位于:
/components/com_content/views/article/tmpl/default.php能否提供有关
default.php
内部更改内容的更多详细信息?能否提供有关default.php
内部更改内容的更多详细信息?
<div class="container-fluid">
<div id="landing-bkg">
<div class="row">
<div class ="col-sm-7 col-xs-12">
<h1>Headline</h1>
<h3>Subhead</h3>
<div class="btn">
<p>Button</p>
</div>
</div>
<!-- END COL -->
</div>
<!-- END ROW -->
</div>
<!-- END LANDING BKG-->
<div id="another2">
<div class="row">
<div class="col-sm-12">
<h2 class="center">Headline</h2>
<h3 class="center">Subhead</h3>
<div class="btn btn-center">
<p class="center">Button</p>
</div>
</div>
<!-- END COL -->
</div>
<!-- END ROW -->
</div>
<!-- END ANOTHER2-->
<div id="another3-bkg">
<div class="row">
<div class="col-sm-12">
<div class="row">
<div class ="col-md-7 col-sm-12 col-xs-12">
<h2>Headline</h2>
<h3> Subhead</h3>
<div class="btn">
<p>Button</p>
</div>
</div>
<!-- END NESTED COLUMN -->
</div>
<!-- END NESTED ROW -->
</div>
<!-- END COL -->
</div>
<!-- END ROW -->
</div>
<!-- END ANOTHER3 BKG-->
<div id="another4">
<div class="row">
<div class="col-sm-12">
<h2 class="center">Subhead</h2>
<form>
<input type="email" placeholder="Input Field" class="center-block">
</form>
<div class="btn btn-center">
<p class="center">Button</p>
</div>
</div>
<!-- END COL -->
</div>
<!-- END ROW -->
</div>
<!-- ANOTHER 4 -->
</div>
<!-- END CONTAINER -->
/****HTML & BODY ****/
html,
body{
width:100%;
height:100%; //Makes my DIVs 100% height, works great
margin:0;
padding:0;
}
/****CONTAINER ****/
.container-fluid{
height:100%;
}
/**** JOOMLA CLASSES I OVER RIDE TO GET THE DIVS AT 100% DOESN'T WORK WITHOUT IT ****/
.item-page{
height:100%;
}
div[itemprop="articleBody"]{
height:100% !important;
}
/**** FOOTER ****/
.footer-container{
background-color:#565A5C;
width:100%;
padding-top:50px;
padding-bottom:25px;
}
footer{
position:relative;
}
.footer-row{
width:100% !important;
margin:0 !important;
}