Move button at the end of a Paragraph text

Hi there,

the only way to do that is to NOT use a button, and instead include the link in the text.
You can then use some CSS to style that link to look like a button.

Hi David,

and I could style that text exactly like the button looks now? Iam afraid my CCS is too dusty to get that done haha

Without too much pain it could be 'almost' identical - the icon may need to differ a little.
If you want to add the link to the text, leave the button in place for now for reference, and then give me access to that page ill see what CSS is required.

Thanks David,

Feel free to have a look if its not too much trouble on your end!

I will be out for the next 4 hours now, so youve got the Dashboard all for yourself :) Password in the private section.

1. Add this CSS to your site:

.inside-article .has-styled-link a {
    background-color: rgba(188, 191, 101, 0.5);
    color: var(--contrast);
    font-size: 12px;
    font-weight: 700;
    padding: 4px 6px;
    text-transform: uppercase;
    display: inline-flex;
    align-items: center;
    transition: .2s background-color ease-in-out, .2s color ease-in-out, .2s border-color ease-in-out, .2s opacity ease-in-out, .2s box-shadow ease-in-out;
}

.inside-article .has-styled-link a:hover {
    background-color: #222222;
    color: #ffffff;
}
.inside-article .has-styled-link a:before {
    content: '\276F';
    font-weight: 500;
    margin-right: 6px;
}

2. Select the text block that will contain your link and in Advanced > Additional CSS Class(es) add: has-styled-link

Hey David,

wow awesome! I see now why you guys got the best support :)

Thanks so much, really appreciate it since its not really related to your product anymore.

It worked like a charm, the only thing Id like to adjust would be the alignment of that link text. For instance I would like to see how it looks when its moved to the right side of the DIV.

Sadly, just changing align-items: center; to align-items: right; didnt work, maybe I am using the wrong word?
https://www.screencast.com/t/92FroPX6H2z1

I am slowly starting to like the Layout and looks of my site :)

Thanks a ton,
Chris

Hi Chris,

You can give this CSS a try:

p.readmorecss a {
    float: right;
}

Awesome, thanks! that worked.

One more follow up on this, i see its already set to center and played with the padding options, but I cant align the link text to appear exactly on the same height as the paragraph text?
https://www.screencast.com/t/gUWkv6qqTEg

Which setting do I have to change or perhaps add to just move it upwards 1-3 pixels?

As the topic has been marked as resolved, the login info has been erased so I can't see your site now.

I think you can try margin-bottom for the button.

Thanks,

I will put log in info into the private field.

The margin didnt work for me, I tried it with margin-bottom and thhen with margin: bottom;

    padding: 1px 5px;
    margin: bottom;
    text-transform: uppercase;

Oh I mean something like:

margin-bottom: 2px;

What's the user name?

Thanks,
that would just move the image around but not the box around the text Im afraid based on my testing just now.

Not seeing a way to adjust that unfortunately.