charmax: (One of those days)
charmax ([personal profile] charmax) wrote2006-10-23 12:55 am
Entry tags:

CSS Anyone?

Do any of you on my flist know how to deal with CSS? If so, can you please, please help me out? ;) I have validated my stylesheet and it comes up clean but... I am still getting 2 big errors with the layout. One is the navigation background image (popping up where I don't want it to! Behind other links! Stay in the bloody navigation!) and number 2 error is the links I make within a page (bizarre wideness! Navigation image!)

Any help on this will be much appreciated.


ETA: Issues all fixed thanks to [livejournal.com profile] lim
ext_1558: baby Spock peeking up over the bottom of the icon (Default)

[identity profile] lim.livejournal.com 2006-10-23 12:00 am (UTC)(link)
I'm just trawling and I noticed this.

Your navigation background image is applied to your anchor selector (a).

If you just want it on the navigation, and not ALL links in your layout, you need to take out this

a {

* background-image : url(http://bronze-ambition.net/BTP/images/navbg.jpg);
* display : block;
* background-color : #61846c;
* color : #4f868d;
* padding : 5px;


and group it with your #nav div instead, so, underneath

div#navigation {

* float : left;
* width : 300px;


put

#navigation a, a:link{background:url(http://bronze-ambition.net/BTP/images/navbg.jpg) #61846c;color:#4f868d;padding:5px;display:block;}

ext_1558: baby Spock peeking up over the bottom of the icon (Default)

[identity profile] lim.livejournal.com 2006-10-23 12:01 am (UTC)(link)
and, er, then of course you need to style your global a and a:link as you want it.

[identity profile] charmax.livejournal.com 2006-10-23 12:02 am (UTC)(link)
Oh thank you thank you! I shall change it now. :D

[identity profile] charmax.livejournal.com 2006-10-23 12:32 am (UTC)(link)
Again thank you, that is fixed! There is still something up with the links but the image has gone now.
ext_1558: baby Spock peeking up over the bottom of the icon (Default)

[identity profile] lim.livejournal.com 2006-10-23 11:35 am (UTC)(link)
*nosy*

What's up with the links? Your CSS is very muddled. It would be easier to find the problem if you ordered it hierarchically:

body {
font: 0.9em Tahoma, Arial, sans-serif;
text-align: center;
color: #000;
background: url(http://bronze-ambition.net/BTP/images/palebg.jpg) #61846c left repeat-y;
}
a, a:link {
color: #6b9b91;
text-decoration: none;
font-weight: normal;
background: #61846c;
}
a:visited {
color: #000;
}
a:active {
color: #000;
cursor: help;
}
a:hover {
color: #468191;
font-weight: bold;
cursor: help;
background: #b5b466;
}
blockquote {
margin: 5px 10px;
padding: 5px;
border-right: 5px solid #bab869;
font-family: Arial, Tahoma, sans-serif;
}
ul {
padding: 5px 20px;
border-right: 10px solid #507e7e;
color: #000;
background: #468191;
}
p {
margin: 5px 10px 10px;
}
header h1 {
background-color: #bab768;
color: #56857f;
height: 490px;
line-height: 490px;
margin: 0;
padding-left: 0;
background: url(http://bronze-ambition.net/BTP/images/BTPheader.jpg);
}
#container {
text-align: left;
width: 700px;
margin: 0 auto;
}
#navigation {
text-align: center;
float: left;
width: 300px;
}
#navigation a, a:link {
background: #61846c url(http://bronze-ambition.net/BTP/images/navbg.jpg);
color: #bebc6b;
padding: 5px;
display: block;
}
#content p {
text-align: left;
line-height: 1.4;
}
#extra {
float: right;
width: 400px;
color: #000;
background: #61846c;
}
#footer {
width: 700px;
height: 35px;
background: url(http://bronze-ambition.net/BTP/images/footerbg.jpg);
}
#footer p {
margin: 0;
padding: 1em 2em;
}


'k? What do you want to change?

[identity profile] charmax.livejournal.com 2006-10-23 05:57 pm (UTC)(link)
I have changed the hierarchy as you suggested and it's all working great now! Thank you for all your help on this. :D Do you mind if I call on you if I have any further problems?

(Anonymous) 2006-10-23 07:51 pm (UTC)(link)
Any time. :)
ext_1558: baby Spock peeking up over the bottom of the icon (Default)

[identity profile] lim.livejournal.com 2006-10-23 07:55 pm (UTC)(link)
Er, that was me saying anytime. LJ keeps logging me out.

[identity profile] charmax.livejournal.com 2006-10-23 09:23 pm (UTC)(link)
Ok I thought I had my links sorted but they are still acting weird http://beyond.bronze-ambition.net/art2.php

What am I doing wrong??
ext_1558: baby Spock peeking up over the bottom of the icon (Default)

[identity profile] lim.livejournal.com 2006-10-23 11:32 pm (UTC)(link)
dear GOD this is annoying. I cannot stay logged into LJ however many cookies I allow. Dammit.

Anyway. Yes: notes. Here if you want them. No biggie if not.

[identity profile] charmax.livejournal.com 2006-10-23 11:47 pm (UTC)(link)
I keep having the same problem with LJ today, well not just LJ, every site I visit. Everything in general is being a pain in the arse! Heh.

Back to the coding - I'm not quite sure what you mean by
"Your content division is inheriting its link styles from your navigation division instead of your body."

I think notes will be very helpful if you have them!