jacestar11 0 Posted March 29, 2017 Report Share Posted March 29, 2017 Hi, I just need a simple code to add space between words. I have some text above a pic so I would like one word to align to the left and the other to the right. So it would be (if you refer to the image) Seca 674 Information. One of my words is actually a link to another page though so not sure what I can use. I thought of using <p>...</p> but then the height spacing is too big (like the top image in the picture attached). Help! Thanks in advance for all your suggestions. Quote Link to post Share on other sites
Ingolme 1,021 Posted March 29, 2017 Report Share Posted March 29, 2017 It doesn't matter which element you use because you can use CSS to change the padding or margin of the element. If it's a link, use <a>. The element you use should describe the content. If any of the elements in the table on this page matches the meaning of your text, then use them. If nothing can properly describe your content then use <div> for block display and <span> for inline display. You should never choose an HTML element based on how it looks, but based on how well it describes the content. Use CSS to change how an element looks. Quote Link to post Share on other sites
jacestar11 0 Posted March 29, 2017 Author Report Share Posted March 29, 2017 This is my text (I use Wordpress for the website): Seca 674 <a href="http://69.89.27.208/~balands8/seca-674/" target="_blank">Information</a> I want to know what I can use to add a decent space between Seca 674 and Information (which is the link). Nothing of what you said makes much sense to me. Sorry. Quote Link to post Share on other sites
Ingolme 1,021 Posted March 29, 2017 Report Share Posted March 29, 2017 If all you want to do is add space between the elements, you need CSS. You can add padding to the left of the link. Quote Link to post Share on other sites
jacestar11 0 Posted March 29, 2017 Author Report Share Posted March 29, 2017 Can you pretend that you are explaining it to a 5 year old? As in, where am I suppose to put the code and, oh ya, what would the coding be? I'm guessing I have to put p { padding-left: 80px;} somewhere but since I am still learning... Quote Link to post Share on other sites
Ingolme 1,021 Posted March 29, 2017 Report Share Posted March 29, 2017 You should go through the CSS tutorial first, everything should be answered there. There's no point just copying and pasting code, you need to understand what it does. Quote Link to post Share on other sites
jacestar11 0 Posted March 29, 2017 Author Report Share Posted March 29, 2017 I understand what they do. It's just to know where I have to place them. Quote Link to post Share on other sites
Ingolme 1,021 Posted March 29, 2017 Report Share Posted March 29, 2017 The answers are in the CSS tutorial: https://www.w3schools.com/css/css_howto.asp Quote There are three ways of inserting a style sheet: External style sheet Internal style sheet Inline style Quote External Style Sheet <head> <link rel="stylesheet" type="text/css" href="mystyle.css"> </head> Quote Internal Style Sheet <head> <style> body { background-color: linen; } h1 { color: maroon; margin-left: 40px; } </style> </head> Quote Inline Styles <h1 style="color:blue;margin-left:30px;">This is a heading</h1> Quote Link to post Share on other sites
davej 251 Posted March 29, 2017 Report Share Posted March 29, 2017 There is always the simple nbsp character, but if you have no understanding of CSS then you should learn how to use that. Quote Link to post Share on other sites
jacestar11 0 Posted March 30, 2017 Author Report Share Posted March 30, 2017 Ohhhh thanks davej. I never even thought to use nbsp character. That actually worked great. Thanks for your help. It was so simple. Quote Link to post Share on other sites
dsonesuk 914 Posted March 30, 2017 Report Share Posted March 30, 2017 This might be over kill, when you can simply add padding to link on left. Wrap in span, span is inline like anchor link <span>Seca 674<a href="http://69.89.27.208/~balands8/seca-674/" target="_blank">Information</a></span> then use span a:before {content: ""; padding-left: 1ex;} using before anchor text means this will have underline. Quote Link to post Share on other sites
jacestar11 0 Posted March 30, 2017 Author Report Share Posted March 30, 2017 Thanks dsonesuk, I will give that a try. Although, the nbsp character worked out great! Quote Link to post Share on other sites
Recommended Posts
Join the conversation
You can post now and register later. If you have an account, sign in now to post with your account.