Problem with a 100% height column

HTML & CSS
1

Hi again!

For some reason, I tought that this design would be easier to code than [URL=“http://lynxdaemon.net/Vicky/old/index.html”]this one. But it’s seems that I was wrong. After many hours, there’s two errors that I just can’t resolve by myself.

The biggest problem is the grey column on the left (with the logo). It should always be 100% of the browser height, without any margin at the top or bottom. Wich is not the case right now, and after many tweaking and tutorial and revisions, and still can’t figure out why or how to make it work.

The second problem isn’t that important, but it’s really bugging me: I can’t make the underline disappear on my “nolink” class while hovering on it. I can do without, I’m just wondering why.

Right now, I’ve only tested it in Firefox (don’t see the point to start debugging in other browser while it’s still broken in Firefox).

I know those are very common questions, but even so I’m totally stuck.

The website: http://lynxdaemon.net/Vicky/
The CSS: http://lynxdaemon.net/Vicky/style.css

Thanks for your help :slight_smile:

2

It’s working! Thanks a lot :slight_smile:

3

Hi,

You can’t add an images to both html and body when they are set to height:100% because they won’t expand.

You would need to say this instead.


html{height:100%;}
body{min-height:100%}

However that means you cannot use any other height:100% in you page because you can’t inherit a height from min-height but they may not be an issue for you.

If you also want 100% height content you would need to do something similar to this demo.

4

The problem with the nolink class is that you have placed it on the inner span and the inner span does not have any text-decoration applied to it so turning it off isn’t going to work because it isn’t on in the first place. :slight_smile:

It’s the anchor that has the decoration so apply the class to the anchor or target it from the parent.

e.g.


#piedpage a:hover{text-decoration:none}