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 » Center area post/pages »

[SOLVED] Positioning center column with a fixed left margin on background image


  #1  
Old Jun 12, 2011, 06:08 AM
annsworld
 
140 posts · Mar 2010
Hi,


I have added a background image to www.annsworld.com

I would like the actual website starting with the logo area's upper left hand corner to be positioned at the top (which it does) and 200px away from the background image's left edge. Currently it centers horizontally.

There must be a way of positioning the whole thing align: left; padding-left:200px; (or something like that. But where would I actually have to put this?

ATO -> ???

Thanks,
Ann.
  #2  
Old Jun 13, 2011, 09:03 AM
lmilesw's Avatar
lmilesw
 
10,176 posts · Jul 2009
Central New York State USA
To position the center area as you want you would use something like the following.
HTML Code:
#wrapper {
    left: 200px;
    position: absolute;
}
As an aside the file size of your background image is very large (almost 1Mb) and will slow down page loads.
__________________
~Larry (CNY Web Designs)
This site should be a membership site since it so full of good stuff.
Please consider donating which gives you access to even more good stuff.
  #3  
Old Jun 13, 2011, 10:18 AM
annsworld
 
140 posts · Mar 2010
Thank you. Do I put that into the CSS or ito the header where I put the code for the background image?

Ann.
  #4  
Old Jun 13, 2011, 10:20 AM
annsworld
 
140 posts · Mar 2010
Missed the bit about the page loads. Oh thank you, I need to look at that. I need actually to rewrd the background image - I took the one from twitter to test. :-)

As an aside, how do I get an image to tile? For the other site I am working on.
  #5  
Old Jun 13, 2011, 02:52 PM
lmilesw's Avatar
lmilesw
 
10,176 posts · Jul 2009
Central New York State USA
Quote:
Originally Posted by annsworld
Do I put that into the CSS or ito the header where I put the code for the background image?
You put it in ATO>Add HTML/CSS Inserts>CSS Inserts
__________________
~Larry (CNY Web Designs)
This site should be a membership site since it so full of good stuff.
Please consider donating which gives you access to even more good stuff.
  #6  
Old Jun 13, 2011, 02:53 PM
lmilesw's Avatar
lmilesw
 
10,176 posts · Jul 2009
Central New York State USA
Quote:
Originally Posted by annsworld
As an aside, how do I get an image to tile? For the other site I am working on.
You use the CSS repeat command. See w3schools.com
__________________
~Larry (CNY Web Designs)
This site should be a membership site since it so full of good stuff.
Please consider donating which gives you access to even more good stuff.
  #7  
Old Jun 13, 2011, 10:02 PM
annsworld
 
140 posts · Mar 2010
Thank you Larry,

Turns out I had a semicolon too many in there that's why it didn't tile. Life would be soooo much easier without typos!!

The wrapper thing is not working. The inner column moves around as before rather that staying attached to the left hand side at 200px. Any ideas?
  #8  
Old Jun 14, 2011, 06:29 AM
lmilesw's Avatar
lmilesw
 
10,176 posts · Jul 2009
Central New York State USA
So just to be clear... Are you saying you put the following in the CSS Inserts box in the theme options? (I changed it a bit as I think the 230px is more what you need.)
HTML Code:
div#wrapper {
    position: absolute;
    left: 230px;
}
If that isn't working try adding !important after each line as below.
HTML Code:
div#wrapper {
    position: absolute !important;
    left: 230px !important;
}
__________________
~Larry (CNY Web Designs)
This site should be a membership site since it so full of good stuff.
Please consider donating which gives you access to even more good stuff.
  #9  
Old Jun 22, 2011, 02:08 AM
annsworld
 
140 posts · Mar 2010
Hi Larry, thanks.

Sorry about the delay - I haven't been able to work on this for a few days.

Anyhow, I put in ...
Quote:
div#wrapper {
position: absolute !important;
left: 230px !important;
}
... and it is completely ignoring that, as well. :-(
  #10  
Old Jun 22, 2011, 09:46 AM
lmilesw's Avatar
lmilesw
 
10,176 posts · Jul 2009
Central New York State USA
Isn't CSS fun?
It sometime is a matter of trying this and trying that so try this which worked in my tests.

In ATO>Style & configure Layoue>Layout container style
  • Change position: relative; to position: absolute;
  • Add width: 760px;
  • Add left: 230px;
You can also remove the code from before just to clean things up.
__________________
~Larry (CNY Web Designs)
This site should be a membership site since it so full of good stuff.
Please consider donating which gives you access to even more good stuff.
  #11  
Old Jun 22, 2011, 09:52 AM
annsworld
 
140 posts · Mar 2010
lol... you can see how much fun I am having from the bite marks on the side of the table I have been biting into ... :-)

...

trying

...

oh shit... big problem. Now the centre column is tiny. But it did fix the whole thing ont he LHS where it is supposed to go.

Have a look ...
  #12  
Old Jun 22, 2011, 09:55 AM
annsworld
 
140 posts · Mar 2010
Took them out one by one. It is the "relative" substituted for "absolute" which makes the centre column really tiny. WHY?????
  #13  
Old Jun 22, 2011, 09:56 AM
lmilesw's Avatar
lmilesw
 
10,176 posts · Jul 2009
Central New York State USA
Did you add width: 760px ?
__________________
~Larry (CNY Web Designs)
This site should be a membership site since it so full of good stuff.
Please consider donating which gives you access to even more good stuff.
  #14  
Old Jun 22, 2011, 09:58 AM
annsworld
 
140 posts · Mar 2010
Actually just had another look. it makes the right sidebar attach to the left border

The centre column seems to be one letter wide. Showing the title of a post basically vertically.
  #15  
Old Jun 22, 2011, 10:00 AM
annsworld
 
140 posts · Mar 2010
yes I did.

I have this:

Quote:
position: absolute;
width: 760px;
left: 230px;
pasted in there.

it seems that one needs perhaps to put something else there for the centre column width?
  #16  
Old Jun 22, 2011, 10:01 AM
lmilesw's Avatar
lmilesw
 
10,176 posts · Jul 2009
Central New York State USA
It looks like you still haven't added width: 760px; to the Layout Container Style box
__________________
~Larry (CNY Web Designs)
This site should be a membership site since it so full of good stuff.
Please consider donating which gives you access to even more good stuff.
  #17  
Old Jun 22, 2011, 10:05 AM
annsworld
 
140 posts · Mar 2010
I did, though. Look: :-)


Last edited by annsworld; Jun 22, 2011 at 10:09 AM.
  #18  
Old Jun 22, 2011, 02:29 PM
lmilesw's Avatar
lmilesw
 
10,176 posts · Jul 2009
Central New York State USA
Add !important after the width and see what happens. Your code would look like the following.
HTML Code:
position: absolute;
width: 760px !important;
left: 230px;
__________________
~Larry (CNY Web Designs)
This site should be a membership site since it so full of good stuff.
Please consider donating which gives you access to even more good stuff.
  #19  
Old Jun 23, 2011, 04:30 AM
annsworld
 
140 posts · Mar 2010
Yes! That did it! Thank you.

one donation coming up. :-)

Thanks,
Ann.

Bookmarks

Thread Tools Search this Thread
Search this Thread:

Advanced Search
Display Modes


Similar Threads
Thread Thread Starter Forum Replies Last Post
[SOLVED] Background image in center column??? theadventurebite Center area post/pages 3 Jan 18, 2011 01:25 PM
[SOLVED] Margin below center column and above footer marced Center area post/pages 8 Dec 5, 2010 07:57 AM
Fixed Position Layout with fixed center column? 49Monsters Center area post/pages 1 Nov 3, 2010 02:41 PM
Fixed height center column henning Center area post/pages 6 Jul 27, 2010 10:16 AM


All times are GMT -6. The time now is 10:05 PM.


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