Wordpress Themes - WP Forum at BFA
Click Here To DONATE! Support the theme development, get more attention and additional benefits based on your donation level. Your forum name will be highlighted.

Wordpress Themes - WP Forum at BFA » WordPress Themes » Atahualpa 3 Wordpress theme » Center area post/pages » Post-Kicker, -Byline & -Footer »

[SOLVED] Byline format alignment left AND right


Build custom WP THEMES, without
coding.
Click here for THEMEFRAME

From the author of Atahualpa, the #1 most
downloaded (700,000+) theme @ wordpress.org
  #1  
Old Jun 3, 2010, 06:24 AM
marced
 
60 posts · Feb 2010
I want to align date (%date('jS F Y')%) on the left, and other text (in this case sociable icons) on the right, within the byline in posts.

How do I align one piece of text to the left, and other one to the right? Div doesn't work with float because then the text in body get's wrong, 2 divs in one byline creates two rows... So Can't work it out...

I can of course do it by inserting another object with width="xxx" so the the width to fixed, but the center column width changes in my webpage depending on where you are.

I think it should be simple, but I am too simple for that apparently

Last edited by marced; Jun 3, 2010 at 06:27 AM.
  #2  
Old Jun 3, 2010, 08:02 AM
juggledad's Avatar
juggledad
 
22,170 posts · Mar 2009
OSX 10.8.5 WP 3.8.x Atahualpa 3.7.x Safari 6.x Firefox 25 XP
wrap part in a <div> and use css. For example, lets say you want the footer to have the date to teh left and categories to the right, you could put this in the FOOTER: Homepage
HTML Code:
%date('F jS, Y')% <div id="my_foot"> Category: %categories-linked(', ')% </div>
then add this to the CSS Inserts
HTML Code:
#my_foot {float:right;}
__________________
Give a person a solution, you fix one issue, teach a person how to solve their problem you enable them forever.
Juggledad | Forum Moderator/Support
  #3  
Old Jun 3, 2010, 09:04 AM
marced
 
60 posts · Feb 2010
Thanks for that JD, but it creates the same problem as with what I tried, it stops the bodytext in the post then where the right div starts (with social icons), see result on
http://www.marced.com/

It stops where the floating div starts...
  #4  
Old Jun 3, 2010, 09:37 AM
juggledad's Avatar
juggledad
 
22,170 posts · Mar 2009
OSX 10.8.5 WP 3.8.x Atahualpa 3.7.x Safari 6.x Firefox 25 XP
I'm not sure what you mean this is what I see in safari on a mac
Click image for larger version

Name:	ubent.jpg
Views:	364
Size:	40.2 KB
ID:	517
__________________
Give a person a solution, you fix one issue, teach a person how to solve their problem you enable them forever.
Juggledad | Forum Moderator/Support
  #5  
Old Jun 3, 2010, 02:34 PM
marced
 
60 posts · Feb 2010
Okay, in Internet Explorer it looks like this:
.

As you can see, the text stops now where the right div starts, as said it wasn't like that before this change....
  #6  
Old Jun 7, 2010, 08:35 AM
marced
 
60 posts · Feb 2010
Anybody knows?
  #7  
Old Jun 7, 2010, 10:14 AM
lmilesw's Avatar
lmilesw
 
10,082 posts · Jul 2009
Central New York State USA
What version of Internet Explorer?
__________________
~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.
  #8  
Old Jun 8, 2010, 03:40 AM
marced
 
60 posts · Feb 2010
IE 7 at work, and at home I have 8, both same problem.

Solved it now by inserting a transparent image width fixed with, but not the best solution of course.
  #9  
Old Jun 8, 2010, 05:36 AM
juggledad's Avatar
juggledad
 
22,170 posts · Mar 2009
OSX 10.8.5 WP 3.8.x Atahualpa 3.7.x Safari 6.x Firefox 25 XP
Hi, I'll take a look this morning. Sorry to leave this in a lurch. My church got struck by lightning last week and all sorts of problems occured. The pastors computer got fried, a network card in another computer, half the ports on three routers and a switch all got fried. And I do the support, so I'm still trying to clean up the mess. I had to yank the HD from the pastors computer and comnnect it to another one so I could grab his sermon for Sunday...hmmm maybe I should have...wait, stop thinking like that or who knows what the lightning will hit next
__________________
Give a person a solution, you fix one issue, teach a person how to solve their problem you enable them forever.
Juggledad | Forum Moderator/Support
  #10  
Old Jun 8, 2010, 05:42 AM
juggledad's Avatar
juggledad
 
22,170 posts · Mar 2009
OSX 10.8.5 WP 3.8.x Atahualpa 3.7.x Safari 6.x Firefox 25 XP
could you set it back so I can capture the source to play with?
__________________
Give a person a solution, you fix one issue, teach a person how to solve their problem you enable them forever.
Juggledad | Forum Moderator/Support
  #11  
Old Jun 15, 2010, 04:55 AM
marced
 
60 posts · Feb 2010
Hey JD, That's quite a story, you don't make that up Hope you got everything up and running again and things are going normal at the church now...

Sorry I didn't get back earlier too, was away.

I set it back on this page:
http://www.marced.com/2010/05/30/u-b...n-goed-helaas/

I inserted this code again:
Code:
%date('F jS, Y')% <div id="my_foot">test text for align</div>
and added
Code:
#my_foot {float:right;}
to css.

Everything fine in Safari but still not in Internet Explorer, text stops where the right align div starts.

Hope you got time again and can help. Thnx JD!

Last edited by marced; Jun 15, 2010 at 04:58 AM.
  #12  
Old Jun 15, 2010, 08:09 AM
juggledad's Avatar
juggledad
 
22,170 posts · Mar 2009
OSX 10.8.5 WP 3.8.x Atahualpa 3.7.x Safari 6.x Firefox 25 XP
your CSS is all messed p. Have you been making changes to css.php? If you do a find on 'td#right-inner' you will find some weird stuff right after it. This is what I see:

td#right-inner {
vertical-align:top;
border-right:solid 0px #DDDDDD;
margin:14px;
padding:26px 7px 0px 7px;
font-color:#EEEEEE;
text-decoration:none;
background:#FFFFFF;
link-decoration:underline;
a:link {
color:grey
}

;
A:link {
text-decoration:underline
}

;
font-family:calibri;
link-style:italic;
font-size:14px;
font-weight:
}


td#middle {
vertical-align:top;
width:100%;
padding:22px 15px 5px 15px;
spacing:0px 0px 5px 5px;
background:#FFFFFF;
margin:1px 0px 5px 0px;
font-family:myriad;
border-right:9px solid #E4ECF4
}

there are other questionable things in your CSS.

I can't possible help with the CSS that messy. You need to get a fresh copy of css to work with.

What version of Atahualpa are you running?
__________________
Give a person a solution, you fix one issue, teach a person how to solve their problem you enable them forever.
Juggledad | Forum Moderator/Support
  #13  
Old Sep 6, 2010, 06:30 AM
marced
 
60 posts · Feb 2010
Been a while, have been busy with all kinds of developments, sorry for not answering.

I don't know which version of Atahualpa I am running, where can I see that?

How can I refresh my css most easily? Download a new css.php file? I have no clue why it is messed up, I did all my CSS customizing within the ATA option meant for that (add HTML/CSS inserts).

Appreciate your help.
  #14  
Old Sep 6, 2010, 06:48 PM
lmilesw's Avatar
lmilesw
 
10,082 posts · Jul 2009
Central New York State USA
The version of the theme is at the top left of the theme options. If you have not modified any theme files and done nothing other than make changes in the theme options you could take out all the CSS that is in ATO>Add HTML/CSS Inserts>CSS Inserts and see how things look and start from there. If you do that I would copy and paste all that code into a notepad document to save it. If you have Atahualpa 3.5.3 you could also export your settings in ATO>Export/Import Settings as a backup.

If you are not clear on any of this please ask more questions before doing anything.
__________________
~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.
  #15  
Old Sep 16, 2010, 09:29 AM
marced
 
60 posts · Feb 2010
lmilesw,

Thnx for your reply. My version is 3.4.5.1. It's a good plan to take everything out and then start from scratch again, so putting back the CSS one by one again. Gonna do that tomorrow, if I have a question I'll post it!
  #16  
Old Sep 27, 2010, 04:29 PM
Lucker
 
17 posts · Apr 2009
Hello, I've got absolutely the same problem with appearance %sociable% in IE.
http://shershidsky.ru

I added in CSS?HTML insert some code, but nothing extraordinary
Any ideas?

Cheers

P.S. Changed div to <p> for the time to dig the issue, so in IE it appears simply left-aligned

Last edited by Lucker; Sep 27, 2010 at 04:46 PM.
  #17  
Old Sep 28, 2010, 05:29 AM
Lucker
 
17 posts · Apr 2009
For some reason this solution doesn't work.

Quote:
Code:
%date('F jS, Y')% <div id="my_foot">test text for align</div>
and added

Code:
#my_foot {float:right;}
to css.
Currently in my byline I use %comments%, %wp-print% and %wp-email%. I wrap it into <p> tag with right alignment. It moved to next line, but looks fine in all browsers.

If I try to change %wp-print% and %wp-email% to %sociable% (which I like really more), troubles begin. In IE %sociable% skip to next line and left-align. In Safari %sociable% appear as bullet list (vertical) left align. Etc...

If I try to change <p> to <div> (as suggested above), in IE any post width ended at the point <div> begin.

So, is there any chance to use %sociable% in byline with right alignment?

Thank you for any idea!

Cheers
  #18  
Old Sep 28, 2010, 06:05 AM
lmilesw's Avatar
lmilesw
 
10,082 posts · Jul 2009
Central New York State USA
I tested your float:right and it worked fine for me. When you say you added the code to css do you mean 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.
  #19  
Old Sep 28, 2010, 06:36 AM
Lucker
 
17 posts · Apr 2009
Hello, lmilesw, thank you for answer.

Yes, I added some code into ATO>Add HTML/CSS Inserts>CSS Inserts. There are some styles for search form, table reloaded, hackadelic slider note, some widget appearance and sidebar_widget_area.

Now it may looks fine, 'cause I came back to the previous settings (with %wp-email% and %wp-print%). Additionally right now I have no <div id="my_foot"> in my website, only in CSS stylesheet. I can't let visitors to see the mess on my website. I could set the <div> again for some minutes If you choose particular time to take a look (with IE and Safari).
  #20  
Old Sep 28, 2010, 07:13 AM
lmilesw's Avatar
lmilesw
 
10,082 posts · Jul 2009
Central New York State USA
I was looking at it and it dawned on me to use the following instead of what you had. You need to put the text you want to float right before what you want it to float right of.
HTML Code:
<div id="my_foot">test text for align</div>%date('F jS, Y')%
__________________
~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.
  #21  
Old Sep 28, 2010, 07:30 AM
Lucker
 
17 posts · Apr 2009
lmilesw, thanks a tons, it works just fine after your wise advice!

Cheers

Bookmarks

Thread Tools Search this Thread
Search this Thread:

Advanced Search
Display Modes


Similar Threads
Thread Thread Starter Forum Replies Last Post
How to format 2 right sidebars savannah22 Sidebars & Widgets 1 Mar 6, 2010 12:05 PM
Feed alignment Webmason RSS, Feeds & Subscribing 0 Dec 7, 2009 04:31 PM
Format comments alickerman Comments, trackbacks & pings 7 Oct 1, 2009 04:17 AM
Page Menu Bar. Left align. But 200px from left margin??? mush Atahualpa 3 Wordpress theme 5 Jul 29, 2009 03:40 PM
right sidebar alignment DedalusBr Sidebars & Widgets 2 Feb 11, 2009 04:36 PM


All times are GMT -6. The time now is 12:09 PM.


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