Xtreme 3.0.4 footer not centered on blog page

[tix]

Greetings,

After upgrading to the new version I have a problem to center the footer on the blog page. The pages had it too until I took out the background from the extra CSS and put it up in the Xtrme Plus Background Image options.

On the blog page the footer floats left and the background colour extends, while the background image ends on the right side of the theme width (1000px)

This is what I’ve added in the theme options for the footer:

Full Width Options
Footer Area Expand: 

V
Footer Area Extend BG: V
Footer Extend BG: #787878

Footer widget Area
extra CSS: {min-height:130px;text-align:left;}  (I had to add align-left because the text got centered in all footer widgets + I had to add it to the content area options too, to get the text on posts and pages align left.)
Align Area: center

---

The page source of both the blog and the pages reads like this:

<div class=”clear-container-end” style=”clear:both“></div></div><!– /#container –>

<footer id="colophon" class="colophon font-verdana center wvrx-fullwidth wvrx-expand-full" role="contentinfo">

---

I’ve checked the Custom CSS and the only thing I’ve added to the colophon are rules for the footer menu. Out of those rules the a hover doesn’t work anywhere.

/*— footer styles —*/
#colophon_menu .menu_bar {background-color:transparent; border:0;}
#colophon ul{margin-top:8%;}
#colophon li {list-style-type:none;display: inline;padding:0 5px 0; }
#colophon a{background-color:transparent;color:#fff;text-decoration:none;}
#colophon a hover{text-decoration:underline;color: #a2bc70;}

 
Sorry I can’t give you the url, it’s a client site.
I didn’t do the theme upgrade on other sites yet because I fear the same problems.

I also noticed the name I gave the theme when I saved it now got some additional marking to it, like this: myname-V-858

Thank you.
Have a nice day.

[Weaver]

It is almost impossible to help without a link to the site.

You #colophon ul/li rules will apply to everything in the #colophon, not just the menus. Change them to #colophon .wvrx-menu ul, etc.

The hover rule should be #colophon a:hover – needs the :.

The changed theme name is intentional to help track when you’ve changed settings.

Any theme rules about centering and extending the footer would apply equally to ALL generated pages, so anything broken on the blog page would be custom CSS. 

Are you using the default blog page, or a Page with Posts? It is highly recommended to use a Page with Post as all options apply the that page, while the default blog (index.php) only uses global options.

[scrambler]

– First regarding:

This is what I’ve added in the theme options for the footer:
Full Width Options
Footer Area Expand:  V
Footer Area Extend BG: V
Footer Extend BG: #787878

DO NOT use more than one extend option on the same area, they do different things so combining them makes no sense and causes problems.

So decide if what you want for the content is:

• To be full width (use Expand)
• Or the Main background attributes to be full width, but the content to stay contained in the site width ( Extend BG Atributes)
• Or if you need a differenmt background color than the main background color for the extension (use Extend BG color box)

Please read the tutorial on how to use full width design features

Full Width Designs

IMPORTANT:

• Expand:
  * Expanding a Main Area (Header Area; Container Area; Footer Area) Automatically expands all its Sub Areas.
  So you should not check Expand on both a Main Area and some of its Sub Areas , as this could cause errors.
  * Expand expands everything, background attributes AND content.
  It should not be mixed with Extend BG attributes or Extend BG Color on the same element
• Extend BG Attributes:
  * Only expands the background attributes (including color) but keeps the content limited.
  It should NOT be mixed with Extend BG color or Expand on the same element
• Extend BG color:
  * Is only to be used if the area is NOT expanded and if you need a different color for the extension.
  It should not be mixed with any of the other two on the same element

– Second and as Weaver said.

Provide a link to the site and explain precisely what you are trying to achieve.

[tix]

Hi weaver and scrambler,

menu hover: solved. Thank you, it was of course my bad CSS on the hover detail.

Footer on blog: I used page with posts & put it on Extend BG Attributes only, but it isn’t solved.
I’ve sent you the blog link in private message. 

Thank you for your fast replies, as always.

[scrambler]

Your footer appears to be outside of the wrapper.
This means the HTML in your page is broken.
There is most likely some open / close tag error that is throwing the whole structure off.

You need to check all your HTML content using an HTML validator and see if you can locate the error.
The error you are looking for are opened tag (like <div>) that are not closed and vice versa

[scrambler]

You appear to have an extra closing </div> after your posts

Check your page content editor in text mode.

[tix]

I checked, there was nothing wrong with it. Div tags were both there. No extra closing </div>

Next I copied the entire div, took it out of the post and saved. The footer was ok after that.
Next I put back in what I copied, saved the post. Footer ok.

So strange. But anyway, it’s solved  & that’s what matters 🙂

Thank you for your time.

Have a nice day.

[scrambler]

It may actually not be solved and show up on some other browser or next time any content changes. The problem with HTML error is that they give unpredictable result, so giving up on finding them is never a good idea.

I cant check right now but will try to have a second look to see it the issue is still there

[Author]

Posts