[SOLVED] Byline format alignment left AND right
 

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 ;)

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
then add this to the CSS Inserts

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...

I'm not sure what you mean this is what I see in safari on a mac
Attachment 517

Okay, in Internet Explorer it looks like this:
http://www.marced.com/MarcIE.png .

As you can see, the text stops now where the right div starts, as said it wasn't like that before this change....

Anybody knows?

What version of Internet Explorer?

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.

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 ;)

could you set it back so I can capture the source to play with?

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:
and added 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!

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?

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.

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.

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!

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

For some reason this solution doesn't work.

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

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?

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).

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.

lmilesw, thanks a tons, it works just fine after your wise advice!

Cheers