+ 2
Put links in one line
Hi there I made a code with a div that has a few links but the problem is that the links all come up on different lines, ho w can I make it so that they all come in one line? (Its sort of a bar on the top of the page with links to all parts of the page (a nav bar))
14 Antworten
+ 1
can we see the code ?
fyi <div> are block level element, you can change its display to inline using css to make it behave like <span>
+ 1
Taste oh thanks but I figured it out cuz I had put each link in a seperate div so I took it out of div and now its on one line my only problem is now how can I put space between each link?
+ 1
Taste so im guessing I can add a class to an <a> tag...... but can I design the text to make the links nice and not be purple after clicked?
+ 1
Taste I mean design it as in make a nice font and color
+ 1
yeah, just use css as usual.
:visited will inherit property from its main ruleset.
.aClass{
/*whats in here*/
font-familiy: serif;
color: white;
padding: 5px;
background: #222;
}
.aClass:visited{
/*will also be applied here*/
/*you can also override
what main ruleset had*/
color: lime;
}
+ 1
Taste sorry i dont get what yo mean by /*whats in here*/
+ 1
oh yeah I knew it waas a comment just wondered if twas neccessary thanks for your time
+ 1
thanks Joshua but can you help me make all links evenly devided on the nav bar? tried a padding but when I put it on one of the links it worked only when I cliked that link (thats when there was space between links) but when I clicked the other links it went back to being all together so I added a padding to the other ones but it got all messed up......
0
simplest solution by adding margin for each link
0
yes by using pseudo class :visited
.aClass:visited{ color: blue }
0
its a comment, it wont make any difference in the code.
just an explaination from me.
0
just add the following to your css:
div a {
display: inline-block;
}
0
Taste, that will not solve the problem, you must set it to display inline or inline block.
0
try this:
div a {
display: inline-block;
margin: auto;
}