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 »

How to float against Centre Column


  #1  
Old Oct 16, 2012, 03:13 AM
annsworld
 
140 posts · Mar 2010
How to float against Centre Column

I am looking for the code to define for a piece of content to float up against the left hand side of the center column:

If I use float: left; then a piece of content floats against the left hand side of the entire website. Thus if the window is small - the content overlaps with the center column.
Click image for larger version

Name:	Screen Shot 2012-10-16 at 11.10.47 AM.png
Views:	751
Size:	31.6 KB
ID:	2068
If the window is very large, it is very far away from the centre column.
Click image for larger version

Name:	Screen Shot 2012-10-16 at 11.10.08 AM.png
Views:	721
Size:	35.2 KB
ID:	2067

What I would like is for that piece of content to float up against the left hand side of the centre column (outside the center column that is in the background area) regardless of how large the window is.
Click image for larger version

Name:	Screen Shot 2012-10-16 at 11.11.04 AM.png
Views:	761
Size:	32.4 KB
ID:	2069

Can you help me, please?

Thanks,
Ann.
  #2  
Old Oct 16, 2012, 03:45 AM
juggledad's Avatar
juggledad
 
23,765 posts · Mar 2009
OSX 10.11.5 WP 4.x Atahualpa(all) Safari, Firefox, Chrome
Quote:
How Elements Float

Elements are floated horizontally, this means that an element can only be floated left or right, not up or down.

A floated element will move as far to the left or right as it can. Usually this means all the way to the left or right of the containing element.

The elements after the floating element will flow around it.

The elements before the floating element will not be affected.

If an image is floated to the right, a following text flows around it, to the left:
Taken from http://www.w3schools.com/css/css_float.asp
__________________
"Tell me and I forget, teach me and I may remember, involve me and I learn." - Benjamin Franklin
Juggledad | Forum Moderator/Support
  #3  
Old Oct 17, 2012, 06:00 AM
annsworld
 
140 posts · Mar 2010
THank you for your reply juggledad. That is how I understood how it worked, but I cannot get it to work in this application. I tried it in the header area and I also set in up in the left sidewidget. My expectation was that the left sidewidget should do it, as it is flush against the centre column. so a float right should work. Instead the whole think ended up to the right hand side of the screen. Not of the element it was in. Apart from that, the left sidewidget is in the center part thus not exactly where I want it to be. :-(

As shown in the screenshot. I do not want to put code in the centre container because then I have to edit the file each time I upgrade the software.

Any ideas?

Last edited by annsworld; Oct 17, 2012 at 06:02 AM.
  #4  
Old Oct 17, 2012, 06:10 AM
juggledad's Avatar
juggledad
 
23,765 posts · Mar 2009
OSX 10.11.5 WP 4.x Atahualpa(all) Safari, Firefox, Chrome
what's the url?
where did you put your code?
__________________
"Tell me and I forget, teach me and I may remember, involve me and I learn." - Benjamin Franklin
Juggledad | Forum Moderator/Support
  #5  
Old Oct 17, 2012, 08:44 AM
lmilesw's Avatar
lmilesw
 
10,176 posts · Jul 2009
Central New York State USA
As you have found working with floats and positioning can be a challenge especially because Atahualpa uses a table layout. How about another option such as this plugin the allows for floating share buttons always visible on the left side of the screen?
__________________
~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 Oct 17, 2012, 11:37 AM
annsworld
 
140 posts · Mar 2010
Hi Guys, :-)

Die url is www-thebirdschool.com

I had tried the plugin before I started with the code. It had exactly the same issues. I had hoped to get around this by putting code in myself (and now I am tearing my hair out ...)

I have tried the code in:
ATO=>C
  • onfigure Header Area
    and also
  • in the left sidebar per text widget

The code is
Code:
<!-- AddThis Button BEGIN -->
<div class="addthis_toolbox addthis_floating_style addthis_32x32_style" style="left:50px;top:475px;background:#00adef;">
<a class="addthis_button_preferred_1"></a>
<a class="addthis_button_preferred_2"></a>
<a class="addthis_button_preferred_3"></a>
<a class="addthis_button_preferred_4"></a>
<a class="addthis_button_compact"></a>
</div>
<script type="text/javascript">var addthis_config = {"data_track_addressbar":true};</script>
<script type="text/javascript" src="http://s7.addthis.com/js/300/addthis_widget.js#pubid=ra-xxxxxxx"></script>
<!-- AddThis Button END -->
I had also tried all kinds of variations including float: right; when positioned in the left sidebar but that just bounced it all the way across the screens right hand edge.

Somehow it does not recognise the side of the sidebar as the end. I was hoping that there was just a bit of code issing like "align:leftsidebar;" :D or something like that that I was not aware of ....

Thanks for your help.

Bookmarks

Thread Tools Search this Thread
Search this Thread:

Advanced Search
Display Modes


Similar Threads
Thread Thread Starter Forum Replies Last Post
[SOLVED] Float Image Between Center Column And Footer bswb97 Center area post/pages 1 Aug 9, 2011 02:53 PM
0 padding / margin above centre column striped aardvark Center area post/pages 3 Jun 28, 2010 01:27 PM
two colour centre column? adri Page & Category Menu Bars 1 Oct 10, 2009 06:18 PM
Centre column content dissapearing in IE6 aquilaciencia Sidebars & Widgets 0 Aug 19, 2009 06:21 AM
Scroll Centre Column gcaleval Sidebars & Widgets 2 Jul 13, 2009 08:02 PM


All times are GMT -6. The time now is 11:28 AM.


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