Viewing Thread:
"CSS help"

Okay I'm having a CSS problem with my site, I have a bar with links in "block", at the moment the blocks are aligned on the left. How do I go about centering them in the middle?

Thanks in advanced :)


#block {
float:left;
clear:both;
background-color: #DEDECE;
width: 768px;
height:26px;
border-left: #A5A5A5 solid 1px;
border-right: #A5A5A5 solid 1px;
border-bottom: #A5A5A5 solid 1px;
}

#block a {
text-align: center;
width: 90px;
text-decoration: none;
line-height: 26px;
display: block;
float: left;
}

#block a:hover {
text-decoration: underline;
}

#block span {
float: left;
line-height: 25px;
}

____________________

<div id="block">
<a href="test.html" class="pagelink">Page1</a><span>|</span>
<a href="test.html" class="pagelink">Page2</a><span>|</span>
<a href="test.html" class="pagelink">Page3</a><span>|</span>
<a href="test.html" class="pagelink">Page4</a>
</div>



I sorted the problems I mentioned before. New problem. I got rid of the ticker box as I didn't really need it because I can do the changes with these right?

Anyway when I got rid of the ticker box, it broke the page and went next to the thing above it. So I added float: left; to 3 of the things below. Should I have done that? It stopped it from breaking the page so I moved on. I want to a space between the things above and below it. Can I & Where do I place the padding/margin bit.

After that the ticker is sorted and the world it as peace once more.

10 gold stars to the man (or lady) who helps this poor fool, thats how much I want this finish and working/looking good.

/*------------ TICKER ------------*/
a.tickl{
font-family:Verdana,Arial,Helvetica,sans-serif;
font-size:11px;
line-height:12px;
text-decoration:none;
color:#003000;
font-weight:bold;
float: left;
}
a.tickl:hover{
color:#ff0000;
text-decoration:none;
}
.ticki{
width:629px;
height:13px;
overflow:hidden;
color:#003000;
float: left;
}
.ticko{
width:629px;
float: left;
border-top:1px solid #cccccc;
border-bottom:1px solid #cccccc;
padding:4px 0 4px 0;
margin:4px 0 2px 0;
display:block;
}
.tickls{
color:#666666;
}
.tickh{
display:none;
}

Sheesh, just upload what you've done and show it to us.

aww but I'm saving it for the big unveiling :'(

12 gold stars?? :(

okay nevermind, I'll just stick it in the ticker box again.

Who knew building a website could be so frustrating.

Thanks again for the Ticker Hmmm :D it's great! Just what I wanted and looks great now that it's all sort ^_-

Machie wrote:
> Who knew building a website could be so frustrating.

I can assure its not as frustrating as trying to help people who dont want to post the things they want help with. :P

Surely you can look at all the coding and picture it how it should be in your imagination cant you? ;D heh sorry Garin.

I'm working on the javascript layer thing now, so please tell me if you know of any problems with javascript layers and browser support. I don't want to set it all up to find out AOL browser doesnt like it. You're my "Go to Guy" so should I be cautious?

After some searching I came across this guys example here which is what I'm after, just going to do some testing.

Its possible it wont work on some browsers, it'll ultimately depend on the code you use though. Theres work arounds for alot of the browser differences, just a matter of whether what you use takes care of this (or uses methods that work cross-browser).

What you linked to looks pretty nice though. I'd imagine it works in most modern browsers.

Ah that's good then, just trying to shove it into one of my page. It works, just it wants to overlap several things above it where I want it. hmm maybe if I add a float:left; into one of these divs.

Something tells me I cant solve all my CSS problems by adding float:left; hehe

Problem 1: How to stop the javascript layers from overlapping the other div above it (in IE its under the div above)
Check for Errors: Is the ticker coding okay?

Please click here to view the problem(s) listed above. Thnx :^)

;)