Gap below footer...
I cannot, for the life of me, determine why I have a gap below the footer of my pages on this site. The URL is...
http://excelhr.businesscatalyst.com/index.html
My settings are as follows...
and index...
I realize the page heights are different in these shots, but that was a test I did right before I submitted this quesiton. It makes no difference. The footer is dragged to the bottom of the page, and is aligned to the red guide designating bottom of browser.
Any help would be much appreciated...
Thanks in advance.
Tried with both 'sticky footer' selected and deselected. The site is not fixed height, so without it selected one of the pages had the footer in the middle of the page. The selection made no difference on pages that did match the overall site's designated height. It still had the 10 to 20 pixel gap at the bottom.
Coincidentally, I am working with two sites right now that were doing the same thing, and the fix for both was to trun off all effects and groupings, and pull the box about 30 pixels below the 'bottom of page'. And all of my testing was being done on the master page itself, and still getting the gap, so page settings vs site settings would not have played into it.
I saw that post that discussed the sticky footer too, and tried it then.
Similar Messages
-
CSS design, gap below images in IE
I'm really getting into ditching tables for CSS / divs, but
am coming up against all the browser bugs you're warned about. Some
I can fix but one that has me puzzled is where my masthead image,
within a div, looks fine in Firefox but has a couple of pixels gap
below it and the next div element below it (which will be used for
navigation). I can't show you a link as it's not live, just very
much at development stage.Rename the page, upload it and post the link.
"Cactus Woman" <[email protected]> wrote in
message
news:eu5ha4$fi$[email protected]..
> I'm really getting into ditching tables for CSS / divs,
but am coming up
> against all the browser bugs you're warned about. Some I
can fix but one
> that
> has me puzzled is where my masthead image, within a div,
looks fine in
> Firefox
> but has a couple of pixels gap below it and the next div
element below it
> (which will be used for navigation). I can't show you a
link as it's not
> live,
> just very much at development stage.
> -
Excessive light leakage from gap below some keys on MBP
Hi all, I got a top of the line 15" MBP a little while ago and recently noticed excessive light leakage from the little gap below some of the keys. It's really only noticable below the W and E keys when sitting or viewing from a certain angle. It can be quite annoying at times. I spoke to a couple of Apple support reps who said that it's common to some extent on most MBP's. I also took it in to my local Apple store, and they said it's "within spec". I was kind of hoping for a better answer after spending almost $2500 on the thing, but whatever. I came across several posts on various Apple forums with people posting about similar issues going back as far as 4-5 years, so obviously Apple hasn't done a great job addressing the issue.
I also noticed a little pinhole size blue light below my J key, which someone pointed out was probably just a logic board light. Are these things common on MBP's? I figure I can get a more honest opinion on here than from Apple support or "geniuses". Any help would be great, thanks!Hi d,
The "light leakage" is not unusual - it's been on every MBP I've seen (if you look at it from the "right" angle). I'm sure there are better and worse keyboards due to manufacturing. -
I have a header on a template that is showing a gap between it and the divs in the content below it. I have borders in different colors and you can see it at mojogar.com. The header has a blue line that represents a bottom border line in its CSS.
.thrColHybHdr #header {
background-color: #C9F76F;
margin: 0px;
padding: 0;
border-bottom-width: thick;
border-bottom-style: solid;
border-bottom-color: #30F;
Right below that is a black line that is the border top of the container div for the middle section. They line up fine.
.thrColHybHdr #mainContent {
margin-top: 0;
margin-right: 13em;
margin-bottom: 0;
margin-left: 13em;
padding-top: 0;
padding-right: 1em;
padding-bottom: 0;
padding-left: 1em;
text-align: center;
position: relative;
border-top-width: thick;
border-top-style: solid;
border-top-color: #000;
But, my div inside that "mainContent" div leaves a gap (as do the side ones which I am not posting the CSS but you can see the gaps on the sides at the site). Here is the CSS for that div inside the middle section with the yellow top border.
.defFullTop {
position: relative;
width: 100%;
border-bottom-width: medium;
border-bottom-style: solid;
border-bottom-color: #ff4900;
border-top-width: thick;
border-top-style: solid;
border-top-color: #FF0;
border-right-width: thick;
border-left-width: thick;
border-right-style: solid;
border-left-style: solid;
border-right-color: #C03;
border-left-color: #C00;
Thanks!Page looks roughly the same to me in IE7 and IE8 - a slight gap below the header.
A much bigger problem occurs if you resize browser viewport below 1280px. Everything shifts.
Overall this layout isn't working.
Related links:
Google labs - Browser Size
http://browsersize.googlelabs.com/
Open Source CSS Frameworks and Multi-Column Layouts
http://EZ-CSS.org
http://960.gs/
http://code.google.com/p/blueprintcss/
http://developer.yahoo.com/yui/grids/index.html
http://developer.yahoo.com/yui/grids/builder/
http://layouts.ironmyers.com/
http://matthewjamestaylor.com/blog/ultimate-multi-column-liquid-layouts-em-and-pixel-width s
Nancy O.
Alt-Web Design & Publishing
Web | Graphics | Print | Media Specialists
http://alt-web.com/
http://twitter.com/altweb
http://alt-web.blogspot.com -
Apparent gap below CSS sticky footer in IE?
I've been testing CSS "sticky footer" solutions I found on the Web. The one I picked works in the four browsers I checked with (Firefox, Chrome, Opera and IE) but there's one possible glitch. In IE 8. I'm seeing what appears to be a small gap between the footer and the bottom of the browser window. My Color Cop utility says neither of the two colors in that gap match anything specified in the CSS. I've included a screen capture, and a link if you have IE installed. I'd like to know if this is a problem with IE (who woulda thunk?) or something inherent in the look of IE's browser window?
http://dreamweaverresources.com/tutorials/sticky-footer/I assume "browser chrome" means the imagery used to create the "pieces" of the browser's appearance outside the browser window contents.
Yes.
http://www.expression-web-tips.com/what-is-browser-chrome/
But, if by scrollbar you mean the sliding blue rectangle on white background with a directional arrow on either end, I don't see that anywhere -- side or bottom -- when I view that link in IE 8?
You'll see it if you shrink the height of your browser below a certain dimension.
I saw it on my widescreen monitor. -
White space below footer due to Relative Positioning?
I'm pretty new to coding. I'm learning how to do a responsive website and everything is working, EXCEPT for the huge blank space below the footer at the largest screen resolution. I know it is because of the relative positioning I used for the "samples" section. I know this question has been asked before. I've tried the suggestions, but cannot seem to get it to work. I cannot figure out a way to accomplish having the "samples" section at the spot I want without using relative positioning. I've tried "float" to no avail.
Everything is working, except for the huge space below the footer at the largest screen size for my responsive page.
Instead of pasting my .html and 3 .css files here, here is my site of which you can right click and "view page source" to get all the code. Don't want to make my question look too long!
Here: grc198.orijenaldesigns.com
Any help would be much appreciated!Hi,
Please share the URL of the web site.
Regards,
Abhishek Maurya -
I purchased a Muse template to develop my website and I didn't need every section, so I removed one of them.
Now I have a ton of white space and I have search and tried every suggestion I could find on these forums, but cannot get it removed.
You can see the space below the black footer. Any remedies for this issue? You would think this would be easy.Hi Kris,
There are two things that you need to test here -
1. Reduce the Min Height of the page and see if that makes any difference.
2. Press Ctrl + A/Command + A to select all on the page and see if there is an empty text frame or rectangle towards the bottom of the page that you are not able to locate otherwise.
Make sure to check this on the Master page as well as the page in question.
- Abhishek Maurya -
Having problem with extra space below footer (sticky footer already checked)
Hi there, im having this problem after updated my adobe muse cc. For some reason there is extra space below the footer.
It looks fine when i try to view them offline, but when I upload them, the extra space appears. Here's the url for both of the website with extra space below
1. http://unionvisual.web.id/home-page.html
2. PT-SmasHi there
Thx for your reply, is here i upload my screenshot
and here -
I'm creating my first site in Muse and so far enjoying the process but I can't get my footer to stick to the bottom of the browser window. It looks fine in design mode but when I preview or open the site in my browser there is extra white space below the footer. I've noticed others on the forum have had the same issue. So far I have not seen a resolution or work around. Is this a bug or am I doing something wrong? I made sure the footer option was checked and I've tried adjusting the page and browser handles but I can't seem to correct the problem.
Here is the Design View
Here's what it looks like when I open it in my browser.In the Edit HTML window how do I specify that I want the animation to loop?
Are there samples of HTML code to control some of the simple functions?
Thanks,
David [email protected] -
Keeping a Consitent Gap between Content and Footer.
Hi !
I spent a couple of days trying to solve how to regulate the space between body and footer on a MUSE-project. I think it‘s worth dropping a few line for humankind.
We’re on a master-page. Let’s say our standard page has the following properties:
The Footer-marker is set to y: 500 px
The Bottom_of_Page-marker is set to y: 650 px
The Bottom_of_Browser-marker is set to y: 680 px
These settings mean, you have 150 px height-space for the Footer, starting from y: 500 px.
If you require more space for the Footer, it’s the Bottom_of_Page-marker you’ll have to drag down ( not the Footer-marker ! ).
If you’d like to add a gap, so your Footer is not directly sticking to the Content of the page anymore, but you’d rather like to preserve some space between both, you’ll have to drag down only your Footer-elements a little bit, e. g. down to y: 520 px. So, in a way, the 20 px gap created is part of the Footer. No changes must occur to the Footer-marker, at least for this reason. You’ll only eventually drag the Bottom_of_Page-marker down, in case Gap-height + Footer-height require more space than already available (depending on your figures).
Cheers
GSanjit, I didn't make any changes to the master at all. It was fine online, then I opened it to make a small type change and it was like this, and I can't get it back to where it was.
I tried adjusting the footer, but the slideshow is not on the home master page, just the bottom brown part and the type in it.
I don't know what could have caused it to change from before to now? I haven't touched the file in months. -
Pesky gap in graphics below Flash element
Hello,
I am trying to figure out why Firefox is showing a gap below my Flash banner that doesn't show in IE or Chrome.
I have tried aligning everything above the gap to the bottom and aligning everything below the gap to the top but I still see a gap in Firefox.
Can someone please take a look and tell me what I am doing wrong?
Thank you for any input.
Bocage Plantation
http://bocage2.audiblethinking.net/Sorry about that. I am not exactly sure where the problem is, but I know it takes place after I put the <nav> in (in the html portion). If I understand what I am learning, the CSS at the top will structure my html code so I would have thought the CSS tageting my nav would be the focus. Maybe it is a different section though.
CSS part:
nav p {
font-size: 90%;
color: #FFC;
text-align: right;
font-weight: bold;
background-color: #090;
padding-top: 5px;
padding-right: 20px;
padding-bottom: 5px;
border-top-width: 2px;
border-top-style: solid;
border-top-color: #060;
HTML part: (bold italic is the part I added)
<body>
<div class="container">
<div id="apDiv1"><img src="Lessons/images/butterfly-ovr.png" width="170" height="158" alt="GreenStart Logo"></div>
<header></header>
<nav>
<p>Home | About Us | Contact Us</p>
</nav>
<div class="sidebar1">
<ul class="nav">
<li><a href="#">Green News</a></li>
<li><a href="#">Green Products</a></li>
<li><a href="#">Green Events</a></li>
<li><a href="#">Green Travel</a></li>
<li><a href="#">Green Tips</a></li>
</ul> -
* Edit - I managed to solve the issue on my own. When I moved the footer bar below the text it stopped trying to shove the text down. Now everything is exactly where I want it. Hope this is helpful to someone!
Hey all,
I've recently switched over from using Dreamweaver to Muse and so far I love it. But, I'm having a bit of an issue with the footer. I want it to stick to the bottom of the page rather then the bottom of the browser. I have already tried turning of 'sticky footer' in 'site proporties' and I also made sure that it was not checked off as a footer item. Even after all that, this portion of text is not staying where it is supposed. It looks fine until I sawp to preview mode, preview the site in my browser or click off the master page onto one of the child pages.
Any suggestions? I've included a few images incase anyone needs the visual.She will....
Murray --- ICQ 71997575
Adobe Community Expert
(If you *MUST* email me, don't LAUGH when you do so!)
==================
http://www.projectseven.com/go
- DW FAQs, Tutorials & Resources
http://www.dwfaq.com - DW FAQs,
Tutorials & Resources
==================
"KarenJ" <[email protected]> wrote in message
news:fnr55e$ccs$[email protected]..
> Hi Murray, thanks, so I'm off the hook :-)
>
> Actually my client would care - she had me change all
the 1\ 2\ 3\ to
> 1/ 2/ 3/ on another site.... let's hope she doesn't up
her screen res:-)
>
> Thanks,
>
> Karen
>
> "Murray *ACE*" <[email protected]>
wrote in message
> news:fnr4vq$c8f$[email protected]..
>> You can't, really, other than by using frames. Let
the footer float
>> beneath the contents. Nobody cares, really.
>>
>> --
>> Murray --- ICQ 71997575
>> Adobe Community Expert
>> (If you *MUST* email me, don't LAUGH when you do
so!)
>> ==================
>>
http://www.projectseven.com/go
- DW FAQs, Tutorials & Resources
>>
http://www.dwfaq.com - DW FAQs,
Tutorials & Resources
>> ==================
>>
>>
>> "KarenJ" <[email protected]> wrote in message
>> news:fnr1mh$8us$[email protected]..
>>> Hi Cas - I didn't fix it - I have just looked on
another pc and it was
>>> fine - I have been messing about with screen
resolution and it seems
>>> that when the res goes above 1280x768 the footer
has a gap below it if
>>> the content does not push it all the way down -
not sure how to fix it
>>> though, will keep at it,
>>>
>>> Thanks,
>>>
>>> Karen
>>>
>>> "cas2073" <[email protected]>
wrote in message
>>> news:fnqrsm$2sj$[email protected]..
>>>> Did you fix your problem? I looked at your
website using IE and the
>>>> footer looked fine and I'm having that same
problem and can't fix it.
>>>> How did you fix it?
>>>
>>
> -
http://naruphotography.net/AO/shedule.html
There is a large gap below the nav to the text in firefox but in safari and Opera it is showing corectly.
Any helps would be much appreciatedMarian
Thank you for taking the time to reply.
After the post I put the text in a table and that seemed to fix my problem -
Footer DIV Positioning Problem in Safari
The website I am working on is giving me a huge headache!
Here's a link to a
sample
page
I have also attached the css. Things look okay in Firefox for
me... I'm on an iMac. The footer stays at the bottom of the page
and to the right as it should be. Safari on the other hand, places
the footer in a totally different location. I haven't checked it in
Internet Explorer OR on a PC yet, but I dread the problems I may be
faced with.
Any help would be appreciated as I am running out of
time.Add clear: both; to your #footer css styles (see below)
#footer {
height: 50px;
text-align: right;
padding: 20px 100px 0px 0px;
color: #FFFFFF;
font: 11px/1.5em Georgia, "Times New Roman", Times, serif;
margin: 0px;
width: 980px;
position: relative;
float: left;
clear: both; /* ADD THIS */
OlDirty wrote:
> The website I am working on is giving me a huge
headache! Here's a link to a
>
http://php.wmsgroup.com/eofd6.org/administration.html
>
> I have also attached the css. Things look okay in
Firefox for me... I'm on an
> iMac. The footer stays at the bottom of the page and to
the right as it should
> be. Safari on the other hand, places the footer in a
totally different
> location. I haven't checked it in Internet Explorer OR
on a PC yet, but I dread
> the problems I may be faced with.
>
> Any help would be appreciated as I am running out of
time.
>
> /* Top Elements */
> * {
> margin: 0px;
> padding: 0px;
> }
> body {
> font: 12px/1.5em Arial, Helvetica, sans-serif;
> color: #FFFFFF;
> background: #000000;
> text-align: left;
> }
> p {
> padding-bottom: 12px;
> color: #000000;
> }
> ol { margin-left: 30px; }
>
> /* links */
> a, a:visited {
> color: #333333;
> background: inherit;
> text-decoration: underline;
> }
> a:hover {
> color: #333333;
> background: inherit;
> padding-bottom: 0;
> text-decoration: none;
> }
> a.gallery, a.gallery:visited {
> color: #FFFFFF;
> text-decoration: underline;
> }
> a.gallery:hover {
> color: #FFFFFF;
> text-decoration: none;
>
> /* headers */
> }
> #volunteer h1 {
> font: normal 18px Georgia, "Times New Roman", Times,
serif;
> color: #660000;
> padding-bottom: 10px;
> }
> #content h1 {
> font: normal 22px Georgia, "Times New Roman", Times,
serif;
> color: #650000;
> padding-bottom: 10px;
> }
> #gallery h1 {
> display: block;
> color: #FFFFFF;
> letter-spacing: -1px;
> padding-bottom: 10px;
> font: normal 20px Georgia, "Times New Roman", Times,
serif;
> }
> h2 {
> font: normal 18px Georgia, "Times New Roman", Times,
serif;
> padding-bottom: 4px;
> border-bottom: 1px dotted #650000;
> width: 300px;
>
> /* images */
> }
> .floatright {
> float: right;
> margin: 4px;
> border: 1px solid #CCCCCC;
> background: #EFEFEF;
> padding: 4px;
> }
> .floatleft {
> float: left;
> margin: 4px;
> border: 1px solid #CCCCCC;
> background: #EFEFEF;
> padding: 4px;
>
> /* form elements */
> }
> table {
> border-collapse: collapse;
> border: 1px solid #999999;
> margin-top: 3px;
> margin-bottom: 3px;
> }
>
> td, th {
> padding: 0.1em;
> border: 1px solid #CCCCCC;
> }
> form {
> margin:10px; padding: 0 5px;
> background: #F5F5F5;
> }
> label {
> display:block;
> font-weight:bold;
> margin:5px 0;
> }
> input {
> padding:2px;
> border:1px solid #eee;
> font: normal 1em Verdana, sans-serif;
> color:#777;
> }
> textarea {
> width:400px;
> padding:2px;
> font: normal 1em Verdana, sans-serif;
> border:1px solid #eee;
> height:100px;
> display:block;
> color:#000000;
> }
> input.button {
> font: bold 12px Arial, Sans-serif;
> height: 24px;
> margin: 0;
> padding: 2px 3px;
> color: #333;
> background: #e7e6e6 url(button.jpg) repeat-x;
> border: 1px solid #dadada;
> }
>
> /* search form */
> .searchform {
> background-color: transparent;
> border: none;
> margin: 0 5px 0 10px; padding: 5px 0 15px 0;
> width: 190px;
> }
> .searchform p { margin: 0; padding: 0; }
> .searchform input.textbox {
> width: 100px;
> color: #777;
> height: 18px;
> padding: 2px;
> border: 1px solid #E5E5E5;
> vertical-align: top;
> }
> .searchform input.button {
> width: 60px;
> height: 24px;
> padding: 2px 5px;
> vertical-align: top;
> }
>
> /********************************************
> LAYOUT
> ********************************************/
> #wrapper {
> margin: 20px auto 0px;
> width: 980px;
> position: relative;
>
> }
> #logo {
> float: left;
> height: 192px;
> width: 234px;
> position: relative;
> }
> #header {
> float: left;
> height: 192px;
> width: 745px;
> position: relative;
> }
> #content {
> width: 695px;
> background: #FFFFFF;
> color: #000000;
> float: right;
> position: relative;
> height: 100%;
> padding: 20px 30px 30px 20px;
> }
> #gallery {
> float: left;
> height: 200px;
> width: 116px;
> position: relative;
> background: url(images/photogallery.jpg) no-repeat;
> padding-top: 72px;
> padding-left: 12px;
> padding-right: 10px;
> }
> #training_photo {
> height: 197px;
> width: 234px;
> background: url(images/training_photo.jpg) no-repeat;
> position: relative;
> clear: left;
> float: left;
> }
> #volunteer {
> float: left;
> height: 170px;
> width: 214px;
> position: relative;
> background: url(images/volunteer.jpg) no-repeat;
> padding-top: 27px;
> padding-left: 20px;
> color: #333333;
> }
> #firetruck {
> float: left;
> height: 197px;
> width: 266px;
> position: relative;
> }
> #training {
> float: left;
> height: 197px;
> width: 245px;
> position: relative;
> }
>
> /* Navigation */
> #nav {
> float: left;
> height: 390px;
> width: 234px;
> background: #333333;
> position: relative;
> }
> #nav ul {
> float: left;
> list-style: none;
> width: 234px;
> padding: 0;
> height: 40px;
> display: inline;
> text-transform: uppercase;
> margin: 0 0 0 0px;
> }
> #nav ul li {
> display: inline;
> margin: 0;
> padding: 0;
> }
> #nav ul li a {
> display: block;
> float: left;
> width: 214px;
> color: #999999;
> text-transform: capitalize;
> text-decoration: none;
> font: normal 13px/38px Georgia, "Times New Roman",
Times, serif;
> margin: 0;
> padding-left: 20px;
> border-bottom: 1px solid #666666;
> }
> #nav ul li a:hover,
> #nav ul li a:active {
> color: #FFFFFF;
> }
> #nav ul li#current a {
> background: #DBDBDB url(nav-current.jpg) repeat-x;
>
> /* footer */
> }
> #footer {
> height: 50px;
> text-align: right;
> padding: 20px 100px 0px 0px;
> color: #FFFFFF;
> font: 11px/1.5em Georgia, "Times New Roman", Times,
serif;
> margin: 0px;
> width: 980px;
> position: relative;
> float: left;
> -
Hello,
I just got a 20" Apple Cinema Display and it looks amazing.
However, I have a question.
I noticed that inside the silver bevel there is a thin black gap between the silver edge and "Viewable" area. This gap is uniform on both sides (About a millimeter or so) but is not uniform on the top and bottom. The gap is about 2 millimeters on the bottom and about half a millimeter on the top.
Is this normal? Is the LCD supposed to be slightly "high" in the housing?
Basically the gap below the dock is larger than that above the system bar.
Has anyone else noticed this?The one in our lab (23") is not symetric. I guess this is normal manufacturing tolerance. I never noticed before. It doesn't really bother me. The screen is perfectly rectangular and not cut off by the frame. That's all I really care about.
Maybe you are looking for
-
I just tried to buy Mountain Lion but I am getting this message, yes, even after I reboot: The product distribution file could not be verified. It may be damaged or was not signed. I don't understand what this means? Is my MacBookPro too old to work
-
What program is needed to run itunes?
In attempting to gain some memory on my macbook pro I deleted some of the programs I did not believe I needed. In doing this I lost the program necessary to run my itunes. Can someone help me figure this out?
-
Itunes displays two playlists when nano is connected?
My sons 8 gig nano refuses to sync up and download some albums, video downloads and album art. A message says there are two accounts in itunes which I guess is related to the title of this thread, two separate lists of playlists show in the source co
-
How to read all files' name in a directory and store in a string array?
as title
-
Struts-config.xml flow diagram
Hey everyone... I'm looking for a tool that will take a struts config file and generate a flow diagram. It does not need to be complex, just a simple overview would be great. If anybody knows of a tool that will do something of this sort, please let