Forums

Can't get area to extend when adding a block

Permalink
I'm adding a content block to my site and the area that the block sits in will not expand with the size of the block. See the pictured that I've attached. The red arrow points to the white arrow that should extend with the block. Above & below the red are is a very feint beige color but as you'll see in the second image the block does not sit in that beige, it sits in the white.

This is a downloaded theme so here is some of the page source code.

<div id="wrapper-inner3">
         <div id="inner-page-wrap">
         <div id="innerpage">
         <div class="thinline"></div>
         <div class="thinline"></div>
         <div class="thinline"></div>
         <?php include("elements/headergeneral.php"); ?>
         <div class="line"></div>
         <div class="inner-page-content">
       <div id="container">
         <?php  
        $a = new Area('Gallery');
        $a->display($c);
        ?>      
         </div> <!-- #container -->
Viewing 15 lines of 20 lines. View entire code block.



Here is the CSS associated with this page

#wrapper-inner3{
   float:left;
   width:100%;   
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    -ms-background-size: cover;
    -khtml-background-size: cover;
    background-size: cover;
   -webkit-text-size-adjust: 100%;
   -ms-text-size-adjust: 100%
}
#inner-page-wrap{
   float:left;
   width:64%;
Viewing 15 lines of 34 lines. View entire code block.


How do I get the area to expand accordingly. Thanks for the help.

2 Attachments

bkeschhh
 
ConcreteOwl replied on at Permalink Reply
ConcreteOwl
Try replacing this from your css
.inner-page-content{
   float:left;
   width:100%;
   background:#f0f0f0;
   clear:both;
   border-top:1px solid #fff;
}

With this
.inner-page-content{
   float:left;
   width:100%;
   background:#fff;
   clear:both;
   /*border-top:1px solid #fff;*/
}
bkeschhh replied on at Permalink Reply
bkeschhh
It didn't work :\ the area is still the same.
ConcreteOwl replied on at Permalink Reply
ConcreteOwl
A url would be handy..
bkeschhh replied on at Permalink Reply
bkeschhh
http://briankeschinger.com/index.php/about-me/ sorry! I'm completely stumped on this one and I think it's one of those things where I've been staring at it too long haha. And it should be a simple fix!
ConcreteOwl replied on at Permalink Reply
ConcreteOwl
In your template you have an inline style set to height: 0px
<div id="container" class="masonry" style="position: relative; height: 0px;">

Try changing it to height:100%
bkeschhh replied on at Permalink Reply
bkeschhh
I see that code too when I inspect my page with Firebug, but if you check out the code I posted above - it doesn't exist. I can't find it in my page template or the CSS file. I've also added "height:100%;" to both the #container and .inner-page-content and neither worked. I still can't get it to stretch to the content.
ConcreteOwl replied on at Permalink Best Answer Reply
ConcreteOwl
Try removing the id="container" and make it a simple <div>
bkeschhh replied on at Permalink Reply
bkeschhh
Thank you so much for your time and patience. It works!

I created this id

#newsimple{
  background: #fafafa;
  height: 100%;
  margin: 2% 2% 2% 2%; 
}


and replace it in the div and it's working nicely! Thanks again. I really appreciate it!