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>



Machie wrote:
> How do I go about doing something like this with CCS?
>
> Right column, tabs, mouse over,
> changes listings

Depends which bits you really want. The tabs you can with the css (we talked about it before). The mouse overs are done with layers and javascript. Google for javascript layers you can find many examples of what you want to do, should be able to hack something to get the effect easily enough.

> And if that isn't possible I'd like something like BBC news most
> emailed/read article.

Its actually the same as the first one, the presentation is just a little different thats all.

> Oh and just curious, how are BBC doing their text ticker?

Its Javascript. Google for javascript news ticker. :)

Ah excellent :) thanks Garin, I'll check into it

Unfortunately I already I have another problem :( I have a boxed content, you see them on every site, the ones that sometimes have curvy corners for the headings. Anyway, CSS doesn't do curvy so I wanted to make an image of the top part, and then have a CSS box underneath with the left right and bottom borders completing the box.

Everythings great except for a 1px line between the image and the CSS content. so making it incomplete.

I could fix it in IE by adding
after the image but it didn't work in FF.

Any ideas?

Just incase I've confused you and you don't understand what I want.

click here

The "Buyers" etc. menus, oh just noticed they're doing what I want, a gif "Buyers" image on top and a CSS boxed content underneath.

Machie wrote:
> Everythings great except for a 1px line between the image and
> the CSS content. so making it incomplete.

Could be many things. Lets see the code. ;)

Hmmm... wrote:
> "Off topic"
>
> Hi Dr. Jo,
> Is there a reason why you have your co.uk domain hosted with
> someone else and use Frames to direct the visitors to your
> Freeola content?
>
> This isn't helping your Google presence!
>
> Unless there is a valid reason I would suggest transferring the
> domain to Freeola (it's free!) and removing the Frames. The
> search engines will like it.
>
> It's easy and quick to do... Just say if you want a few pointers
> ;¬)

Hi Hmmm,
I haven't organised the company's website stuff, hubby did, I just did the php programming for it. I'll mention to him about moving the domain.

We've had so many different set-ups recently it's got a bit complicated.

Garin wrote:
> Machie wrote:
> Everythings great except for a 1px line between the image and
> the CSS content. so making it incomplete.
>
> Could be many things. Lets see the code. ;)

aww I knew you were gonna say that >_<


<div id="rightcol">

<img src="news-title.gif" width="200" height="30" alt="" />
<div id="news">
News
</div>

</div>

----

#rightcol {
width: 200px;
float:right;
background: #FFFFFF;
}

#news {
background: #FFFFFF;
width: 198px;
text-align:left;
font-family: verdana;
font-size: 13px;
border-left: #A5A5A5 solid 1px;
border-right: #A5A5A5 solid 1px;
border-bottom: #A5A5A5 solid 1px;
}



how about now? :)

Machie wrote:
> Oh and just curious, how are BBC doing their text ticker?

I liked the BBC News ticker as well. I've used it myself in the past.

I've knocked up a quick working example of the ticker if you want to play: [URL]http://www.hmmm.ip3.co.uk/ticker[/URL]. The BBC insert the ticker page in to an iFrame.

Lots has already been written about the BBC ticker, here's a good place to start [URL]http://www.webreference.com/programming/javascript/professional/chap21/[/URL]

wow thanks a lot Hmmm, impressive. Think I might try and do one for my site :D Though probably shouldnt go nuts with it.

Hope it wont be too difficult to set up :)

hehe I got it working :^D

Any drawbacks to having a ticker from a webdesign point of view? Opinions please.

Machie wrote:
> how about now? :)

Add style="display:block;" to your image tag.