- This topic is empty.
March 28, 2015 at 4:38 pm #199189
I have 3 elements in a row, namely, an input box, one text formatting function and one navigation aid. For the last two I’d like them Right-aligned in the order of ‘formatting function’ (named indent), a white space, and then the ‘navigation aid’ (named expand).
Please see the following codepen for what I mean:
How to fix it?
Many thanks.March 28, 2015 at 5:54 pm #199190SenffParticipant
For starters, take away the widths of the buttons an give them some left/right margins.
Then give the wrapping element (in your case, TD) a specific width in pixels. 600 or so.March 28, 2015 at 9:07 pm #199191
Thanks for the idea. However, problem remains. In the meantime, I reverse the order the last two elements to temporarily get what I need, and yet, it’s not a desirable solution. And I prefer not to set a fixed width for the TD since this screen/panel may expand to cover the 95% of the user’s entire window. Hmm, something still isn’t right.March 29, 2015 at 4:33 am #199193SenffParticipant
You need to be more clear what you exactly want then.March 29, 2015 at 5:24 am #199194
I see you’re still posting Codepen’s with inline CSS….this really isn’t helpful.
I’m inclined to help but you keep making me work for it…you’re going about it the wrong way.March 29, 2015 at 9:35 am #199202
@Paulie_D, fair enough. I’ve separated the CSS code from HTML now. And I have two images files in the same location as the HTML file, however, the two image icons are not being referenced. Why not?
Thanks.March 29, 2015 at 9:49 am #199203ShikkedielParticipant
The path in your CSS would need to be absolute, like
url(http://www.yoursite.com/imagefolder/indent.png).March 29, 2015 at 10:17 am #199205
So…what are our options…can we change the HTML?
Doubtful if CSS is the solution here.March 29, 2015 at 11:06 am #199210
@Shikkediel, I’ve made the change for the URL reference, still no go. Hmm…March 29, 2015 at 11:07 am #199211
“can we change the HTML?”, sure, what needs to be changed for the HTML? tks.March 29, 2015 at 11:26 am #199215
Remove all the extraneous margins & stuff…throw a span around the two elements you need on the right and float that right.March 29, 2015 at 11:59 am #199216March 30, 2015 at 8:56 pm #199306
“Remove all the extraneous margins & stuff…throw a span around the two elements you need on the right and float that right.”, yes, I did, but the images were not showing up. The text icon is not cool at all. Thanks tho.March 30, 2015 at 8:57 pm #199307March 30, 2015 at 11:23 pm #199311
“Remove all the extraneous margins & stuff…throw a span around the two elements you need on the right and float that right.”, yes, I did, but the images were not showing up. The text icon is not cool at all. Thanks tho.
What does that mean?
Your original question was about layout. Is that solved?
The images not showing up is an entirely separate issue.
- The forum ‘CSS’ is closed to new topics and replies.