I've been working on a few sites, and for some reason, a blank bar keeps showing up at the bottom. I've tried inspecting the elements, and I get nothing that makes any sense. html and body elements are set for margin: 0 and padding: 0.
Any ideas on how to remove the blank bar at the bottom?
Thank you!
Remove the from your clearfixing divs. Even with the height:0, the space character is taking up space. One you remove it, the div will collapse properly.
Probably way off here and I'm not sure but one of the plugins you are using is placing a smiley at the bottom of the page. I think it is popular posts that does this.
Have your tried disabling the plugins one by one to see if this goes?
Related
I have a website that is meant to contain a full page image and a navbar at the top. At the very beginning of my project when I encountered the current issue where a white space appears to the right of my image, I simply set overflow-x: hidden. However, now I do not have that option and must deal get rid of it properly. I have created a CodePen that recreates the problem. I have no clue what is causing the issue, any help would be really appreciated.
This post is sorta similar to this one, but I'm keeping it because I think others with the same problem as I had might be able to find it easier.
Your issue isn't that the navbar is longer than the rest of the page, it's that your row content is getting messed up by Bootstrap's default row formatting. By default Bootstrap is giving it a margin right and left of -15px, override it with a in-line style="margin: auto" and everything fits together nicely.
I can't figure out how to remove all the extra space at the bottom of this page. I am a beginner at web design and it probably shows, I only know HTML and CSS and then only a little, but any help with where I have gone wrong would be appreciated.
You have images within 'p' tags that are position:relative; that needs to be updated appropriately they are currently not visible at the bottom, but taking up space at the bottom of the page.They are the button images at the top right.
Example:
adoptaroadwork.png
You'll need to check your design and css to fix this issue.
Can anyone tell me why I have white space at the top of my page:
http://wildwood-design.org/twagons.html
But not this one:
http://wildwood-design.org/index.html
I just can't spot it!
Thanks.
It's the navth under your slideshow. It's not present on the inner pages, and removing it seems to do the trick.
The navth list has no height, but it does have a margin - setting the margin to 0 removes the whitespace. Or, seeing as it's not visible to users, you could just set it to display: none; instead.
Aside: am I right in thinking you're using a WYSIWG program to generate the code? The design works, but all the inline styles are hurting my head and will make the site a pain to maintain in the long run...
I'm developing some kind of website builder project, where I can put the page into a edit mode. Then the content moves 50px down and display the "edit bar". Well sounds easy BUT
The background didn't move down ( fixed with background-position-y: 550px);
Absolute Positions where wrong
That's why I'm getting afraid that just moving the site 50px down can break the whole layout. Can this really happen or am I just overreacting?
Might it be better to put the page into an iFrame, but then I have the problem with cross- frame comuniction...
BR
How about putting the background and everything except the edit bar in a container div and then moving that div?
I'm not sure these will help, but just try to gather more ideas for you:
you can use the method Ken mentioned.
preserve the 50px space on top, and hide the editbar, when it is in edit mode, show the edit bar,
place the edit bar on the bottom.
I can't, for the life of me, work out why there's a fat white line down the right hand side of my page in ie7. Especially as the background isn't even white. I want to be rid of it.
Here's a link and screenshot.
screenshot not yet allowed
The bar disappears with #content{display:none} . I'd appreciate help with a solution that doesn't involve getting rid of everything! Thank you (first question)
Your ieglobal.css is handing a width of 923px to your HTML tag which is pushing your page to the left. Remove that and it should center properly and remove that white piece that you are seeing (which is also being added by the same CSS sheet as a background, url(../img/iestrip.png); OVERFLOW-X: hidden).