CSS help needed - Page 2

User 1903199 Photo


Registered User
8 posts

I see that you are a Beekeeper? I have a good friend here in Oklahoma that has Bees and Ostriches. He's a great person. I learn a lot from him everytime I get to go out to his place.
John
User 1903199 Photo


Registered User
8 posts

Thanks everyone for all the help. I have to leave the office for now and I'll be out of town for a couple of days but I think I can conquer this if I stay on it. For some reason I always have a time of it with new programs... I must not be as smart as I think I am! LOL!
I can't get The HTML Editor to down load for some reason .....so I'm going home and put my feet up!
Again, thanks for everyone's input. You guys are the greatest!

John
User 122279 Photo


Senior Advisor
14,649 posts
Online Now

Yes, we have about 120 beehives keeping us 'buzzy' during the warm season. No ostriches, though ;)

I opened your site and took a look at the source code, and from what I see, it must be a 'drag-and-drop- programme you are using. Am I right?

But if you look at that source code yourself, you can see a lot of 'inline styles', like in this paragraph:

<div id="TXTOBJ7D8251334149C1" style=" position:absolute; top:112px; left:372px; width:142px; height:20px; z-index:6;">
<DIV style="BORDER-RIGHT-WIDTH: 0px; BACKGROUND-COLOR: #000000; MARGIN: 1px; FONT-FAMILY: Verdana; BORDER-TOP-WIDTH: 0px; BORDER-BOTTOM-WIDTH: 0px; COLOR: #000000; FONT-SIZE: 12pt; BORDER-LEFT-WIDTH: 0px" link=#00c0ff>
&nbsp;</FONT><FONT style="FONT-SIZE: 12pt" color=#25a3c7><STRONG><A title="Graphic Design" href="Graphic_Design.html" name="Graphic Design">Graphic Design</FONT></FONT></FONT></FONT></FONT></A></FONT></STRONG></FONT></FONT></FONT></FONT></FONT></FONT></FONT></FONT></FONT></FONT></DIV>
</div>


You see that there are oodles of font tags which probably come from you having changed your mind about the font size a couple of times. If you take those font tags out from this paragraph and put them into its own css file, what remains would be:

<div id="TXTOBJ7D8251334149C1">
<DIV class="font12">
<A title="Graphic Design" href="Graphic_Design.html" name="Graphic Design">Graphic Design</DIV>
</div>


... and the rest of it could be stored in the 'styles.css' like this:

div#TXTOBJ7D8251334149C1 {
position:absolute;
top:112px;
left:372px;
width:142px;
height:20px;
z-index:6;
}
.font12 {
BORDER-RIGHT-WIDTH: 0px;
BACKGROUND-COLOR: #000000;
MARGIN: 1px;
FONT-FAMILY: Verdana;
BORDER-TOP-WIDTH: 0px;
BORDER-BOTTOM-WIDTH: 0px;
COLOR: #000000;
FONT-SIZE: 12pt;
BORDER-LEFT-WIDTH: 0px;
font color:#0080ff;
font weight: bold;
}


The styles.css is linked to the html document by this line in the header section of the html document:

<link rel="stylesheet" type="text/css" href="styles.css" />


And the styles.css has to be saved at the same location as the html document, of course.

A good excercise for you, once you have studied these code bits, would be to do the same as I did with the remaining paragraphs where you see all those redundant font tags.
Ha en riktig god dag!
Inger, Norway

My work in progress:
Components for Site Designer and the HTML Editor: https://mock-up.coffeecup.com


User 106872 Photo


Registered User
92 posts

John, I too had this problem when I was starting out with css. I don't yet have a great understanding of CSS but what helped me and I'll use several analogies like "CSS is like the salad dressing on s salad" or some such notion.
Now I think of CSS as a tool to enhance different parts of the web page, in some ways it might be looked on as a set of commands called rules to change my statement I am the worlds best potter tp
I am The Worlds best [Potter
If I were to use CSS I could make those words a color, a font of any kind, wrapped in a dotted border in a box with a color and placed anywhere on the page.
A div tag named Wyndham (The salad) has a corresponding CSS rule called #Wyndham (The salad dressing) that tells it what to look like and where to put it

Another food image, we all (mostly) use forks,knives, spoons to eat with but a formal dinner, those untinsels have a formal rule (CSS) to tell the person setting the table where to put each item and when.

Please forgive my overly simple explanations but it has helped me to understand part of CSS.
Wyndham
User 629005 Photo


Ambassador
2,174 posts

Wyndham Dennison wrote:
Another food image, we all (mostly) use forks,knives, spoons to eat with but a formal dinner, those untinsels have a formal rule (CSS) to tell the person setting the table where to put each item and when.

That's a great way to think about it :D

Wyndham Dennison wrote:
Please forgive my overly simple explanations but it has helped me to understand part of CSS.
Wyndham

I like food analogies. Well, I like anything to do with food ;)
Living the dream, stocking the cream :D
User 271657 Photo


Ambassador
3,816 posts

I have found this book to be very handy:
Sams Teach Yourself CSS ...in 10 Minutes by Russ Weakley

http://www.amazon.com/Sams-Teach-Yourse … 0672327457

It's small enough to easily pack in my laptop bag or leave in between coffee cups on my desk :D so I have it close by as I fumble around in the HTML Editor. Wyndham - I think your table setting analogy is a great way to explain CSS. ;)
I love deadlines. I like the whooshing sound they make as they fly by. (Douglas Adams)
https://www.callendales.com

Have something to add? We’d love to hear it!
You must have an account to participate. Please Sign In Here, then join the conversation.