Wordpress Themes - WP Forum at BFA
There will be no more development for Atahualpa (or any other theme), and no support. Also no new registrations. I turned off the donation system. I may turn the forum to read only if it gets abused for spam. Unfortunately I have no time for the forum or the themes. Thanks a lot to the people who helped in all these years, especially Larry and of course: Paul. Take care and stay healthy -- Flynn, Atahualpa developer, Sep 2021

Wordpress Themes - WP Forum at BFA » WordPress Themes » Atahualpa 3 Wordpress theme » Header configuration & styling »

[SOLVED] Background Image; Align Top Center Problems...


  #1  
Old Aug 22, 2011, 09:49 AM
Bubblefunk
 
5 posts · Oct 2010
Hi there,
This is my first post. I have a problem in that I cannot get the background image to stay aligned to the center of the page and to the top of the page across the whole website.

I've checked the pages (refreshing the cache each time I make a change) in Firefox, Safari and Chrome and the background image seems to do different things in each browser and on different pages of the website.

Is there a CSS insert or something I can use to make the background image universally the same on all pages in all browsers?

I also would like to align the main body flush to the top of the page (which shows up ok in some browsers and on some pages but not on others).

Pages so far:
http://www.bubblefunk.com/Wordpress/dj_music_biog/
(page aligns to top perfectly but not to center - also image repeating down has been truncated)
http://www.bubblefunk.com/Wordpress/...y/dance-music/
(Page align center ok, but image is truncated at the top)
http://www.bubblefunk.com/Wordpress/...ornia-soul/37/
(Page Aligned to center ok but body is not flush to the top of the page)

Current Body Style html:

background color: #D2FFF0;
background: url(/Wordpress/wp-content/themes/atahualpa/images/BG_Lounge_DJ_House_Chillout_DJs.jpg) aligntop center no-repeat;
font-family: arial, helvetica, sans-serif;
font-size: 16px;
line-height: 1.4;
padding-top: 0px; padding-bottom: 0px;
-moz-border-radius:7px;
-khtml-border-radius: 7px;
-webkit-border-radius:7px;
border-radius: 7px;

What I'm ideally looking for: (Universally across the website
Body & Background Image to Align flush to the top of the page.
Repeat Background Image down but not across.
Setting the background color so the background image will match.

(PS; I realize the images are large with slow download - I will change this).
Any help would be appreciated,
Many Thanks,
James.
  #2  
Old Aug 22, 2011, 10:09 AM
juggledad's Avatar
juggledad
 
23,765 posts · Mar 2009
OSX 10.11.5 WP 4.x Atahualpa(all) Safari, Firefox, Chrome
It looks like you don't have the 3.6.7 PATCHES applied. Here are the links.
  • PATCH 367-01: Odd effects when 'CSS: Compress' = 'Yes'
  • PATCH 367-02 is incorporated in PATCH 367-04
  • PATCH 367-03: PHP errors when adding widget areas in index.php
  • PATCH 367-04: Hovering over a Post/Page title only shows "Permanent Link to"
  • PATCH 367-05: Site Title appended after the 'WordPress SEO by Yoast' title
__________________
"Tell me and I forget, teach me and I may remember, involve me and I learn." - Benjamin Franklin
Juggledad | Forum Moderator/Support
  #3  
Old Aug 25, 2011, 06:32 AM
Bubblefunk
 
5 posts · Oct 2010
Hi Juggledad,
Many Thanks for the update patches. I've applied all of them.

I now cannot see the background image at all. The code remains the same as above for the body style html and the image file in the same place, which I've double checked.

I'm stuck and don't know what to do.

Any help would be gratefully received,
Thanks in advance,
James.
  #4  
Old Nov 18, 2011, 05:09 PM
SharonJ's Avatar
SharonJ
 
644 posts · Sep 2010
Duncan BC Canada
Atahualpa 3.6.1, this worked

body
{
background-image: url("http://skookumheritagechurch.ca/body-bg.jpg");
background-repeat:no-repeat;
background-attachment:fixed;
background-position:center;
width: 100%;
}

Atahualpa 3.7.1 this has the same problem as bubblefunk
body
{
background-image: url("http://haropacific.com/background.jpg");
background-repeat:no-repeat;
background-position:center;
background-attachment:fixed;
width: 100%;
}

Juggledad, do I do the 3.6.7 patches to 3.7.1?

Thanks!
  #5  
Old Nov 18, 2011, 06:18 PM
juggledad's Avatar
juggledad
 
23,765 posts · Mar 2009
OSX 10.11.5 WP 4.x Atahualpa(all) Safari, Firefox, Chrome
Quote:
Juggledad, do I do the 3.6.7 patches to 3.7.1?
nopem there are currently no patches for 3.7.1
__________________
"Tell me and I forget, teach me and I may remember, involve me and I learn." - Benjamin Franklin
Juggledad | Forum Moderator/Support
  #6  
Old Nov 18, 2011, 08:29 PM
SharonJ's Avatar
SharonJ
 
644 posts · Sep 2010
Duncan BC Canada
Atahualpa 3.7.1
body
{
background-image: url("http://haropacific.com/background.jpg");
background-repeat:no-repeat;
background-position:center;
background-attachment:fixed;
width: 100%;
}

Well, then what must I do to make the image vertical align to to the top?

I am thunder-struck...happens quite frequently , actually!!
  #7  
Old Nov 19, 2011, 04:30 AM
juggledad's Avatar
juggledad
 
23,765 posts · Mar 2009
OSX 10.11.5 WP 4.x Atahualpa(all) Safari, Firefox, Chrome
lookup the 'background-position' syntax
__________________
"Tell me and I forget, teach me and I may remember, involve me and I learn." - Benjamin Franklin
Juggledad | Forum Moderator/Support
  #8  
Old Nov 19, 2011, 09:57 AM
SharonJ's Avatar
SharonJ
 
644 posts · Sep 2010
Duncan BC Canada
You are a genius. I had assumed that background-position was only for left/center/right but once I changed it to 'top' it worked like a charm. Thanks again.


Issue resolved.

Bookmarks

Tags
align, background image, background image repeat, center, top page

Thread Tools Search this Thread
Search this Thread:

Advanced Search
Display Modes


Similar Threads
Thread Thread Starter Forum Replies Last Post
Trying to center align smaller header image` Katmoody Header configuration & styling 8 Aug 9, 2011 01:37 PM
[SOLVED] Problems with images and background image in Internet Explorer freelancekonsulenten Sidebars & Widgets 2 Mar 20, 2011 04:02 PM
right align tagline, header image background color cway Header configuration & styling 1 Feb 24, 2011 05:56 AM
[SOLVED] background image causes problems in IE8 tatvaanveShaNam Atahualpa 3 Wordpress theme 2 Jan 31, 2011 07:17 PM
Using background images in Center and Sidebar...Problems Velma Atahualpa 3 Wordpress theme 4 Feb 16, 2009 10:28 PM


All times are GMT -6. The time now is 02:52 AM.


Powered by vBulletin® Copyright ©2000 - 2024, Jelsoft Enterprises Ltd.