jacestar11 Posted March 29, 2017 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. Link to comment Share on other sites More sharing options...
Ingolme Posted March 29, 2017 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. Link to comment Share on other sites More sharing options...
jacestar11 Posted March 29, 2017 Author 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. Link to comment Share on other sites More sharing options...
Ingolme Posted March 29, 2017 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. Link to comment Share on other sites More sharing options...
jacestar11 Posted March 29, 2017 Author 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... Link to comment Share on other sites More sharing options...
Ingolme Posted March 29, 2017 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. Link to comment Share on other sites More sharing options...
jacestar11 Posted March 29, 2017 Author Share Posted March 29, 2017 I understand what they do. It's just to know where I have to place them. Link to comment Share on other sites More sharing options...
Ingolme Posted March 29, 2017 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> Link to comment Share on other sites More sharing options...
davej Posted March 29, 2017 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. Link to comment Share on other sites More sharing options...
jacestar11 Posted March 30, 2017 Author 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. Link to comment Share on other sites More sharing options...
dsonesuk Posted March 30, 2017 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. Link to comment Share on other sites More sharing options...
jacestar11 Posted March 30, 2017 Author Share Posted March 30, 2017 Thanks dsonesuk, I will give that a try. Although, the nbsp character worked out great! Link to comment Share on other sites More sharing options...
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment
Create an account
Sign up for a new account in our community. It's easy!
Register a new accountSign in
Already have an account? Sign in here.
Sign In Now