I've created a unique Wordpress theme and I'm looking to make an element 100% height to fill the remaining available space.
Here is the HTML code snippet:
<header id="masthead" class="navbar navbar-default" role="banner" style="
background: transparent;
">
<div class="container-fluid">
<div class="entry-content2">
<div class="gigi">
<div class="row">
<div class="col-sm-12 col-md-12 col-lg-12 style=" "="">
<img src="wp-content/themes/WordPressBootstrap-master/images/LOGOb.png" class="img-responsive center-block" style="min-width:156px;min-height:83px">
</div>
</div>
</div>
<!-- PLACE THIS CODE AFTER THE HEADER -->
<div class="container-fluid">
<p class="text-center" style="color:white;font-size:17px;padding-left:50px;padding-right:50px;padding-top:20px;padding-bottom:20px;">I have represented and provided legal advice for Romanian and foreign individuals, public institutions, Romanian and foreign legal entities in the following areas:</p>
<div class="row sss">
<div class="col-sm-4 col-md-4 col-lg-3 col-lg-offset-2" style="font-size:17px;color:white;">
<p class="text-left">Civil law<br>
– agriculture, farms, processing and sale of agricultural products;<br>
– trade in food products;<br>
– real estate;<br>
– fuel distribution;<br>
– transport;<br>
– insurance;<br>
– heavy machinery production and sales;<br>
– production of metal structures;<br>
– design, photography, art;</p>
<p></p></div>
<div class="col-sm-4 col-md-4 col-lg-3 col-lg-offset-0" style="font-size:17px;color:white;">
<p class="text-left">Administrative law<br>
– automation production;<br>
– design services;<br>
– automation sales;<br>
– gambling;<br>
– tourism, hotels and guesthouses;<br>
– medical;<br>
– civil and industrial construction;<br>
– machinery and vehicle sales, auto service;<br>
– software production, website management; </p>
<p></p></div>
<div class="col-sm-4 col-md-4 col-lg-3 col-lg-offset-0" style="font-size:17px;color:white;">
<p class="text-left">
– commerce;<br>
– stock exchange, listed companies, investors, investment funds;<br>
– child and elderly care;<br>
– logging and wood processing;<br>
– ore extraction and processing;<br>
– production and sale of construction materials;<br>
– public institutions;<br>
– religious institutions.</p>
<p></p></div>
<p></p></div>
</div>
</div><!-- .entry-content -->
</div>
<div class="container-fluid">
<!-- PLACE THIS CODE AFTER THE HEADER -->
<div class="container" style="
background: #D9D9D9;
width: 100%;
padding-top: 30px;
margin-top: 0px;
">
<nav class="" role="navigation">
<div class="navbar-header">
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#bs-navbar-collapse-1">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
</div>
<div class="collapse navbar-collapse" id="bs-navbar-collapse-1">
<a class="screen-reader-text skip-link" href="#content">Skip to content</a>
<div class="menu-menu-container"><ul id="menu-menu" class="nav-menu"><li id="menu-item-6" class="asd menu-item menu-item-type-post_type menu-item-object-page menu-item-6"><a href="http://avocat2.dac-proiect.ro/" class="<p>menu-image-title-before</p> menu-image-hovered">Home<span class="menu-image-hover-wrapper"><img width="46" height="48" src="http://avocat2.dac-proiect.ro/wp-content/uploads/2015/03/HOME.png" class="menu-image <p>menu-image-title-before</p>" alt="HOME"><img width="46" height="48" src="http://avocat2.dac-proiect.ro/wp-content/uploads/2015/03/HOME2.png" class="hovered-image <p>menu-image-title-before</p>" alt="HOME2" style="margin-left: -46px;"></span></a></li>;
<!-- more menu items here -->
</nav>
</div><!-- .container -->
</div></header>
Currently, there is some space between my element and the top of the screen.
This is my CSS code snippet:
.entry-content2
{
background:url("http://avocat2.dac-proiect.ro/wp-content/themes/WordPressBootstrap-master/images/BODY-DROP.png");
width:100%;
height:100%; //We have tried to make a change so resole this problem
}
Any ideas on how to resolve this issue?
Thank you in advance!