• Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 348
  • Last Modified:

Probably a stupid CSS question

I am trying to figure out why the image hangs off the bottom of this page:
http://officespacefallschurch.com/index.php
There is probably a simple answer to this, but I don't see it. All the container heights are set to auto. I tried inherit, but that didn't work either. On another of these pages, I have added a ton of empty p tags, but I should learn how to fix this!
0
nanharbison
Asked:
nanharbison
  • 4
  • 3
  • 2
  • +1
2 Solutions
 
themrrobertCommented:
Well it looks like you have too many </div> tags.

I think you are leaving "contentBox" class div  earlier than you mean to. But there is also a 2nd extra </div> tag that I can't explain.

You have spaces between class and ="addedImage", I think that's not helping you.

If you remove these lines:
        <div id="bottomphoto">
          	  <p></p>
        </div> 
                      	<p>&nbsp;</p>
</div>
    </div>

Open in new window

And then remove the extra spaces. you might be good.

Also consider using the HTML5 doctype: <!DOCTYPE html>
0
 
nanharbisonAuthor Commented:
Okay, it validates now, that was a good idea. And I removed the extra closing div. Image still hangs off the bottom of the page.
And you mean just use:
<!DOCTYPE html>
and that is it? I changed the doctype to this.
0
Independent Software Vendors: We Want Your Opinion

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

 
jtwcsCommented:
As stated above, there are extra </div> tags towards the bottom of the page.

Updating the following declaration should fix the problem.

.contentText {

font-size:13px;
line-height:24px;
margin-left:13px;
margin-right:13px;
overflow:auto;

}
0
 
themrrobertCommented:
@nanharbison: Yes, that simple doctype is the declaration for html 5.Chosen for backwards compatibility to html 4 if i remember correctly.

I downloaded and tested it, and the result was that adding overflow: auto; to the .contentText class will fix the problem, as was inferred above.
0
 
nanharbisonAuthor Commented:
That was it! Overflow - I don't usually think to use overflow. Thank you, and thanks for reminding me to validate. I had totally lost track of the opening and closing divs.
0
 
jtwcsCommented:
I provided the overflow solution, why was I not credited with the answer?
0
 
nanharbisonAuthor Commented:
what! I credited the wrong person! Can I do something about that?
0
 
nanharbisonAuthor Commented:
I totally missed that you had the same thing.
0
 
jtwcsCommented:
Yes, I provided the solution earlier and themrrobert tested and verified that it worked.

You can Request Attention or post a question in the support topic to ask for moderator assistance.
0

Featured Post

What does it mean to be "Always On"?

Is your cloud always on? With an Always On cloud you won't have to worry about downtime for maintenance or software application code updates, ensuring that your bottom line isn't affected.

  • 4
  • 3
  • 2
  • +1
Tackle projects and never again get stuck behind a technical roadblock.
Join Now