2 Problems - Kind of Obscure

liunx

Guest
these are 2 relatively minor problems and should be easy to solve for anybody with a good grasp of css (hopefully)

i've been using css on my pages for a while now, but not until this week have i actually tried to learn/figure out/decipher what frontpage spits out.

much of it has been trial by error and looking at online guides, my journey into css hasn't been too rocky, but there are 2 problems that have been driving me mad.

------ (i will link instead of give code, because it's multiple files)

I am trying to keep everything inside 1 css file.
I have a background graphic in my menu, to implement it i used
<div id="menu"> and </div>
just inside my body tags.

it works, but the graphic only extends to the level of my text, i can cheat and put in a whole bunch of <br>, but that makes my uncomfortable.
i tried to use a repeat command but i doesn't work.

the page is in frames.
<!-- m --><a class="postlink" href="http://www.geocities.com/ronsarlo/index.html">http://www.geocities.com/ronsarlo/index.html</a><!-- m -->
<!-- m --><a class="postlink" href="http://www.geocities.com/ronsarlo/menu.html">http://www.geocities.com/ronsarlo/menu.html</a><!-- m -->
<!-- m --><a class="postlink" href="http://www.geocities.com/ronsarlo/css/cssculverin1.css">http://www.geocities.com/ronsarlo/css/cssculverin1.css</a><!-- m -->
<!-- m --><a class="postlink" href="http://www.geocities.com/ronsarlo/css/menubackground.gif">http://www.geocities.com/ronsarlo/css/m ... ground.gif</a><!-- m -->

---------------------

my 2nd problem is a little more obscure.
under the Land Air Mechs page, i want there to be borders="1" around the thumbnails

because they are links, they should follow my style sheets should they not?
all links should be blue,blue,blue hover:orange...
as you can see, it works in the menu...

but if unless i force feed that into the body tag for the Land Air Mech page, the links work as default html colors (blue and purple for visited)

the style sheet is functional, or else the font would not be right, neither would the menu links on the left (as they use the same sheet).

the pictures are just imbedded within plain old <a href=http://www.webdeveloper.com/forum/archive/index.php/" .... tags.

<!-- m --><a class="postlink" href="http://www.geocities.com/ronsarlo/html/mecha/lams.html">http://www.geocities.com/ronsarlo/html/mecha/lams.html</a><!-- m -->
----
i'm still picking up css, but i think its just some confusion somewhere.

i would appreciate any help you guys could offer.
thanks a bunch!you should ditch the frames and go all css is all I have to say.

a:link {}
a:visited {}
a:hover {}
a:active {}
is the order your links should go in. I saw no problem with that.
The images
<img src=http://www.webdeveloper.com/forum/archive/index.php/"url" alt="alt" style="margin-bottom:10px;">
you can put that magrin-bottom stuff in a class or whatever. Get rid of the center tags and the <br>s. Center tags are invaid. use float, left, margin to position.Originally posted by PeOfEo
you should ditch the frames and go all css is all I have to say.

The images
<img src=http://www.webdeveloper.com/forum/archive/index.php/"url" alt="alt" style="margin-bottom:10px;">
you can put that magrin-bottom stuff in a class or whatever. Get rid of the center tags and the <br>s. Center tags are invaid. use float, left, margin to position.

-----------------
thanks about the bit about links. i'm a bit of a stickler for perfection... so it's now been fixed...
these are my current "a's" - in which order should they go? (and where can i look it up for myself?)
a:link
a:visited
a:hover
a:active
a img
a:hover img

my first problem (regarding the menu picture has also been fixed, i tossed in a height: 100% into my #menu)
---------------

when you say for me to ditch the frams and go all out on CSS sounds like a GREAT idea, but i haven't the faintest clue where to start...
i'm not even sure how the format will go...
(but will probably save me heck of a lot of work in the long run eliminating the frames index)

can you help me out with that?

---------

somebody else gave me the code to fix the pictures/borders issue...

a img {
border: 1px solid blue;
}
a:hover img {
border-color: orange;
}

but now it borders my image in my #menu and i don't want that, i tried border: 0px and img-border: 0px
still doesn't work...

what should i be using there?

(btw, you've been very helpful)Originally posted by Culverin
somebody else gave me the code to fix the pictures/borders issue...

a img {
border: 1px solid blue;
}
a:hover img {
border-color: orange;
}

but now it borders my image in my #menu and i don't want that, i tried border: 0px and img-border: 0px
still doesn't work...

Assuming images you don't want bordered are inside an element with the ID "menu", this should work:

#menu img {
border:0;
}

That will remove the border from all images that are located inside an element with the ID "menu".Where to start with CSS layouts

Head to <!-- m --><a class="postlink" href="http://www.w3schools.com/">http://www.w3schools.com/</a><!-- m --> to get up to date on the basics. Then head over to <!-- m --><a class="postlink" href="http://www.alistapart.com/">http://www.alistapart.com/</a><!-- m --> to get into advanced CSS, markup, design, and typography.

You can always go to the World Wide Web Consortium web site and look at the standards as they are published by the W3C.

<!-- m --><a class="postlink" href="http://www.w3.org/">http://www.w3.org/</a><!-- m -->

Lastly, validate your HTML at <!-- m --><a class="postlink" href="http://validator.w3.org/">http://validator.w3.org/</a><!-- m --> and validate your CSS at <!-- m --><a class="postlink" href="http://jigsaw.w3.org/css-validator/thanks">http://jigsaw.w3.org/css-validator/thanks</a><!-- m --> a bunch for the links...

i've got just 1 last problem today...

this is my HP
<!-- m --><a class="postlink" href="http://www.geocities.com/ronsarlo/">http://www.geocities.com/ronsarlo/</a><!-- m -->

its done in frames...
and with that picture adjust code, it stuck an ugly-ass scrollbar on my menu...

while there is not scrollbar when testing it locally on ie. 6.0
viewing it online, hosted via geocities (same browser) there is the ugly scroll bar...

how would i get rid of it?Off the top of my head, add

padding: 0;
margin: 0;

In the body styles of the menu page.
Either that, or reduce the height of the #menu <div>, untill the scrollbars disappear.add the scrolling="no" attribute the frame tag.Originally posted by JavaHead Jonnie
add the scrolling="no" attribute the frame tag.
Lol, that works too. :pno probs ;)scrolling="no"... I thought that was the way it shouldnt be done
style="overflow:hidden;"well i thought that scrolling= is a valid attribute for frame tags
 
Back
Top