7 replies [Last post]
larmyia
Offline
Elder
London
Last seen: 12 years 11 weeks ago
London
Timezone: GMT+1
Joined: 2005-01-25
Posts: 1060
Points: 0

Hello All.

I'm having enormous troubles with a site I'm reskinning. The designers have come up with a "lovely" box surrounded some text that has a top and sides that fade out at the bottom of the box (the content of which will vary in size as it comes from a CMS). I am unable to get the darned thing to work. I've created a test case replicating the problem.

Currently the top of the box is showing up, but the sides aren't (unless you turn the top off in firebug, then they show up.....).

I'm sure I'm missing something really simple but I've been working on this non-stop for days and can't see the wood for trees.

As I'm posting a link I hope it's ok that I don't post the code...

http://www.subtleasafish.com/box_test/box_test.html

many thanks!

larmyia

PeterPan
PeterPan's picture
Offline
Enthusiast
London
Last seen: 10 years 49 weeks ago
London
Joined: 2008-03-13
Posts: 51
Points: 11

mmm....

mmm...try remove the white background color for the '.box2' class.

larmyia
Offline
Elder
London
Last seen: 12 years 11 weeks ago
London
Timezone: GMT+1
Joined: 2005-01-25
Posts: 1060
Points: 0

PeterPan may you be forever

PeterPan may you be forever young. I was actually laughing when it worked. you have no idea how long I've been looking at this code and I think that's the one thing I didn't try! Murphy's Law. Knew I needed a fresh pair of eyes.

thank you!

larmyia

PeterPan
PeterPan's picture
Offline
Enthusiast
London
Last seen: 10 years 49 weeks ago
London
Joined: 2008-03-13
Posts: 51
Points: 11

lol...Really, no problem!

lol...Really, no problem! Thought it was rather funny also how it's always the smallest things that give you the biggest problems. Smile

larmyia
Offline
Elder
London
Last seen: 12 years 11 weeks ago
London
Timezone: GMT+1
Joined: 2005-01-25
Posts: 1060
Points: 0

However, I do have one

However, I do have one question...I always put a colour before the url when there's a background. as the w3school states "Always set a background-color to be used if the image is unavailable."

so in this instance what should one do??

Chris..S
Chris..S's picture
Offline
Moderator
Last seen: 8 years 10 weeks ago
Timezone: GMT+1
Joined: 2005-02-22
Posts: 6078
Points: 173

CSS values always take on

CSS values always take on their default - actually what the browser manufacturers set the value to be at the lowest level of the cascade. For background-color that value is transparent.

The w3school point is aimed at a couple of things:
- you need a fall back background for html or body
- if the underlying background (when the image is missing) would make the text unreadable, set a background colour to ensure that can't happen.

Transparent is a valid background colour. Use it where appropriate (or rather don't specify a background-color when you need transparent).

PeterPan
PeterPan's picture
Offline
Enthusiast
London
Last seen: 10 years 49 weeks ago
London
Joined: 2008-03-13
Posts: 51
Points: 11

Ok I have a question...

Oh sorry, didn't read the last post to the end...you answered the question i asked. Silly me...sorry

larmyia
Offline
Elder
London
Last seen: 12 years 11 weeks ago
London
Timezone: GMT+1
Joined: 2005-01-25
Posts: 1060
Points: 0

thanks chris

thanks chris