5 Replies - 50033 Views - Last Post: 16 December 2011 - 11:06 PM

#1 Dewint   User is offline

  • New D.I.C Head

Reputation: 0
  • View blog
  • Posts: 12
  • Joined: 16-December 11

Links in HTML/CSS Same Line With Space

Posted 16 December 2011 - 11:12 AM



Hi. I am quite new to programming so I need some help. I am making a website and at the top I want there to be links in a nice clean sense. Like this :

Home About Contact Us Videos Members

By clicking on each one it takes you to the next page. This is what I have written :
<a href="http://www.google.com"> Home </a><a href="http://www.google.com"> About </a>
It comes up right next to eachother. I want them to have spaces between them but be on the same line. Could someone please help. Thanks,

Dewint.


Is This A Good Question/Topic? 0
  • +

Replies To: Links in HTML/CSS Same Line With Space

#2 Martyr2   User is offline

  • Programming Theoretician
  • member icon

Reputation: 5257
  • View blog
  • Posts: 14,069
  • Joined: 18-April 07

Re: Links in HTML/CSS Same Line With Space

Posted 16 December 2011 - 11:46 AM

Sure, put a space in between each of the </a> and <a> tags...

<a href="http://www.google.com">Home</a> <a href="http://www.google.com">About</a>



Notice in the code above there is an actual space between the closing tag and the opening tag of the item following it. In HTML one space between tags will be recognized, however multiple spaces will be stripped away. So if you wanted to put two spaces you could also use &nbsp; for a non-breaking space.

<a href="http://www.google.com">Home</a> &nbsp;<a href="http://www.google.com">About</a>



However that method can get a bit bulky and inefficient. CSS styling should be used if you need more than one space.

:)
Was This Post Helpful? 2
  • +
  • -

#3 Dewint   User is offline

  • New D.I.C Head

Reputation: 0
  • View blog
  • Posts: 12
  • Joined: 16-December 11

Re: Links in HTML/CSS Same Line With Space

Posted 16 December 2011 - 11:50 AM

Thanks it works! How can I do it so there are more spaces? With CSS? Would be greatly appreciated. I'm very new so I ask many questions...
Was This Post Helpful? 0
  • +
  • -

#4 Martyr2   User is offline

  • Programming Theoretician
  • member icon

Reputation: 5257
  • View blog
  • Posts: 14,069
  • Joined: 18-April 07

Re: Links in HTML/CSS Same Line With Space

Posted 16 December 2011 - 12:07 PM

Here is a document that talks about stylizing links using CSS.

Stylizing Links with CSS

Now if you have no idea what CSS is, here is a site for basic tutorial...

CSS Tutorial

Enjoy! :)
Was This Post Helpful? 1
  • +
  • -

#5 Dewint   User is offline

  • New D.I.C Head

Reputation: 0
  • View blog
  • Posts: 12
  • Joined: 16-December 11

Re: Links in HTML/CSS Same Line With Space

Posted 16 December 2011 - 12:18 PM

Thank you very much. Extremely helpful. First person to help me on the forum so thanks. :D
Was This Post Helpful? 0
  • +
  • -

#6 e_i_pi   User is offline

  • = -1
  • member icon

Reputation: 879
  • View blog
  • Posts: 1,893
  • Joined: 30-January 09

Re: Links in HTML/CSS Same Line With Space

Posted 16 December 2011 - 11:06 PM

If you want to put spacers between your anchor tags, you'll want to read up on the padding attribute. Setting this attribute allows you to put space around an element. You can even set the top, left, right, and bottom attributes separately, with attributes like padding-top.

Another thing you might want to read up on is the CSS Box Model. It can be a little overwhelming the first time you see it, but it accurately explains how spacing around elements works in CSS. Here's two links:

Was This Post Helpful? 0
  • +
  • -

Page 1 of 1