Page 1 of 1

Why isn't this span/CSS working?

Posted: Mon Oct 17, 2005 8:34 am
by mjseaden
Hi there,

Code: Select all

.date { color: #fff; font-weight:bold; font-family: tahoma,sans-serif,arial; font-size:8pt; }
    .title { color: #fff; line-height:12px; font-weight:normal; font-family: tahoma,sans-serif,arial; font-size:8pt; }

    #general a:link,
    #general a:visited {color: #333333; text-decoration: none;}
    #general a:hover {color: #333333; text-decoration: underline;}
    #general a:active { color: #333333; text-decoration: none;}
This set of code is in my CSS script, includes/class.css, which is included in all pages.

I have the following code on this page:

http://www.spanish-property-partnership.biz/index2

Code: Select all

echo '<div id="general"><a href="./content/'.$title.'"><span class="title"><b>'.date('d/m/Y', $row['posttime']).'</b>&nbsp'.strtoupper($row['title']).'</span></a></div>';
However, as you will be able to see by visiting the page, for some reason the styles are not applied. Is there any reason for this?

Many thanks

Mark Seaden

Posted: Mon Oct 17, 2005 10:34 am
by JayBird
Looks okay on my screen in IE 7 and Firefox

Posted: Mon Oct 17, 2005 10:57 am
by Chris Corbyn
Yeah it look like the CSS has been applied here too :) Firefox/Linux.

The links all change size on hover which is kinda irritating :? Maybe that's what you're referring to?

Posted: Mon Oct 17, 2005 11:26 am
by Burrito
only thing I notice is that the width of the table (or div or whatever it is) expands in the center in a couple of places that makes it look a bit out of whack.

Posted: Mon Oct 17, 2005 11:28 am
by mjseaden
Hi, thanks for the comments.

I think the colour scheme looks a bit garish and could do with toning down somewhat - you agree or does it look good?

Thanks

Mark

Posted: Mon Oct 17, 2005 11:30 am
by mjseaden
The other question is, can you tell me what CSS property deals with horizontal alignment (left/right/center etc.)

Posted: Mon Oct 17, 2005 11:32 am
by Burrito
the contrast of the white text and the blue background for the center element is good. You might try lightening up the page background a bit to further enhance the contrast though...maybe a light gray color

Posted: Mon Oct 17, 2005 11:49 am
by Chris Corbyn
I agree on toning down yes :)

Bright is great with complimenting colors but the sites I love the most at the moment are ones which use a fairly pastel styled layout with the odd splash of vibrant color.

To align thing in the center it depends on what you want to achieve:

For text to align in the center of a div you use

Code: Select all

text-align: center
To have one div centered inside another it's more tricky...

Code: Select all

<div style="width: 700px; border: 1px solid black; text-align: center;">
    <div style="width: 400px; margin: auto; border: 1px solid red; text-align: left;">
        This is in the center of the outer div
    </div>
</div>
Note: the text-align: center in the second example should *not* be needed according to the standards. But in IE 6 I've never got it to work without it ;)

EDIT | Also, to make a div go to the left or the right, you use "float: left" or "float: right" on the div that should be on the side