Why isn't this span/CSS working?

JavaScript and client side scripting.

Moderator: General Moderators

Post Reply
mjseaden
Forum Contributor
Posts: 458
Joined: Wed Mar 17, 2004 5:49 am

Why isn't this span/CSS working?

Post 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
User avatar
JayBird
Admin
Posts: 4524
Joined: Wed Aug 13, 2003 7:02 am
Location: York, UK
Contact:

Post by JayBird »

Looks okay on my screen in IE 7 and Firefox
User avatar
Chris Corbyn
Breakbeat Nuttzer
Posts: 13098
Joined: Wed Mar 24, 2004 7:57 am
Location: Melbourne, Australia

Post 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?
User avatar
Burrito
Spockulator
Posts: 4715
Joined: Wed Feb 04, 2004 8:15 pm
Location: Eden, Utah

Post 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.
mjseaden
Forum Contributor
Posts: 458
Joined: Wed Mar 17, 2004 5:49 am

Post 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
mjseaden
Forum Contributor
Posts: 458
Joined: Wed Mar 17, 2004 5:49 am

Post by mjseaden »

The other question is, can you tell me what CSS property deals with horizontal alignment (left/right/center etc.)
User avatar
Burrito
Spockulator
Posts: 4715
Joined: Wed Feb 04, 2004 8:15 pm
Location: Eden, Utah

Post 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
User avatar
Chris Corbyn
Breakbeat Nuttzer
Posts: 13098
Joined: Wed Mar 24, 2004 7:57 am
Location: Melbourne, Australia

Post 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
Post Reply