CSS code editor - Post ID 148030
Hi,
At school we have the free HTML editor. At home I have the full paid for HTML editor. At school, if I'm editing CSS code there is a CSS button that lists all the tags that can be used in CSS. Likewise in editing HTML, you can choose HTML 4.01 etc. At home I can't find the CSS tag. What really bugs me is that I can never remember the comment tags, which are different in HTML and CSS.
TIA for you help.
Steve
At school we have the free HTML editor. At home I have the full paid for HTML editor. At school, if I'm editing CSS code there is a CSS button that lists all the tags that can be used in CSS. Likewise in editing HTML, you can choose HTML 4.01 etc. At home I can't find the CSS tag. What really bugs me is that I can never remember the comment tags, which are different in HTML and CSS.
TIA for you help.
Steve
Hiya Steve,
Check your versions between home and school. Sounds like the school one may have an old version that should be updated (providing you can get all the red tape to allow it that is lol). In the meantime the CSS comment tags are the easiest for me to remember because I used it in other codes it's just forward slash, asterisk, askerisk forward slash. Easy to remember if you treat it like nested tags which close out in order from middle on out to end. Here's how they go:
/* typewhateverhere */
Check your versions between home and school. Sounds like the school one may have an old version that should be updated (providing you can get all the red tape to allow it that is lol). In the meantime the CSS comment tags are the easiest for me to remember because I used it in other codes it's just forward slash, asterisk, askerisk forward slash. Easy to remember if you treat it like nested tags which close out in order from middle on out to end. Here's how they go:
/* typewhateverhere */
Elevator columns and floating images. What on earth have I done now? I can't seem to get consistant results on what should be a simple site. I've read till I'm blue in the face. Any sugguestions?
http://www.collegegrovemethodist.com/worship.html
http://www.collegegrovemethodist.com/worship.html
Hiya Mr. Smith,
Well where to start...
The <center></center> code has been deprecated (means it's basically being phased out) in order to use the styling of CSS and your site is using both CSS code and old code all over the place. You should consider updating that code so you will have a much more valid code in your website so it will work years from now when all the old stuff is phased out. Here's a link to the things that gives you a list of most of the available CSS codes and in the middle column it tells you those that have been deprecated. If you see any of these in your code you should update them to the current type of code using the CSS code instead that has replaced it:
http://www.w3schools.com/tags/default.asp
I'm trying to figure out what the <lu></lu> tags are that you have around your links on the left navigation for the Nursery, History and Music (which is mispelled on your menu btw). I don't know what an <lu> tag is, so tell us that too please. Other than that if that is not your issues then I guess I need more information to know exactly what it is you are having trouble with
Well where to start...
The <center></center> code has been deprecated (means it's basically being phased out) in order to use the styling of CSS and your site is using both CSS code and old code all over the place. You should consider updating that code so you will have a much more valid code in your website so it will work years from now when all the old stuff is phased out. Here's a link to the things that gives you a list of most of the available CSS codes and in the middle column it tells you those that have been deprecated. If you see any of these in your code you should update them to the current type of code using the CSS code instead that has replaced it:
http://www.w3schools.com/tags/default.asp
I'm trying to figure out what the <lu></lu> tags are that you have around your links on the left navigation for the Nursery, History and Music (which is mispelled on your menu btw). I don't know what an <lu> tag is, so tell us that too please. Other than that if that is not your issues then I guess I need more information to know exactly what it is you are having trouble with

Check http://www.eikweb.com/stuff/worship.html
Is this the way you wanted it?
Basically I removed the table you had around the picture and instead created a border around the pic in an image editor. Then I removed a couple of line breaks that pushed the right column down. And I shortened all three columns.
If you download the code from the site, be sure to download the church picture too, then I have made it smaller and added that border. The picture was initially too wide, therefore it was pushed out of the column.
As Jo-Ann says, there is a mixture of old, deprecated html markup and css tags. I have not cleaned up all that. That will serve as an exercise for you at some later stage
Is this the way you wanted it?
Basically I removed the table you had around the picture and instead created a border around the pic in an image editor. Then I removed a couple of line breaks that pushed the right column down. And I shortened all three columns.
If you download the code from the site, be sure to download the church picture too, then I have made it smaller and added that border. The picture was initially too wide, therefore it was pushed out of the column.
As Jo-Ann says, there is a mixture of old, deprecated html markup and css tags. I have not cleaned up all that. That will serve as an exercise for you at some later stage

Ha en riktig god dag!
Inger, Norway
My work in progress:
Components for Site Designer and the HTML Editor: https://mock-up.coffeecup.com
Inger, Norway
My work in progress:
Components for Site Designer and the HTML Editor: https://mock-up.coffeecup.com
Thanks ladies! The tag reference should help. And the "lu," well I guess it was some kind of list.
Now Inger I am really confused. I was planning for the CSS to all go into a separate file. One set of css specs for the entire layout. Should I now shorten all my columns so that I can use this page's dimensions? Merci beaucoup & Tusen takk!

Now Inger I am really confused. I was planning for the CSS to all go into a separate file. One set of css specs for the entire layout. Should I now shorten all my columns so that I can use this page's dimensions? Merci beaucoup & Tusen takk!
Hi again, right now it's just three hours until the start of 2011, and tonight I don't feel like scrutinizing code, so If you can let me have time until tomorrow afternoon, I'll have a look at the css again for you.

Ha en riktig god dag!
Inger, Norway
My work in progress:
Components for Site Designer and the HTML Editor: https://mock-up.coffeecup.com
Inger, Norway
My work in progress:
Components for Site Designer and the HTML Editor: https://mock-up.coffeecup.com
Same here Mr. Smith, but I can tell you that all you need to do to create the CSS file seperately is copy all the CSS tags to a separate text file, without adding the <script> tags at all, just the CSS tags themselves that you already have in the site. These are usually at the top of your site within <script></script> tags like this:
<style type="text/css">
h4, h5 {
margin-bottom: 0;
}
.examples pre {
margin-top: 0;
}
.marquee .author {
display: none;
}
.marquee-author {
float: left;
width: 90px;
text-align: right;
padding: 4px 5px 1px 0;
}
</style>
Just copy the codes similar to above from your HTML pages into a single separate text file without the <style></style> tags. You don't need any doc tags or anything at the top, no meta tags or anything at all just the raw CSS code itself.
The exception to the above would be if you have added any scripts to your site that gave you specific CSS code. When that happens you should put that CSS code where it tells you to rather than in a separate text file. Some scripts and software will create separate CSS files for you which you should leave as is rather than combining them. Doesn't hurt anything to do that as you can still reference them all in the pages.
When you put the code into a separate text file you would save the file with a .css extension not a .txt or .html which most text editors will allow you to do and you can create it right inside the HTML Editor too. Then just add a line like this into your <head></head> tags to let the pages know they need to use that CSS file(s):
<link href="yourcssfilename.css" rel="stylesheet" type="text/css" />
That pretty much is all there is to moving the CSS code to a separate file. Hope that helps and hollar if you need more assistance on that
<style type="text/css">
h4, h5 {
margin-bottom: 0;
}
.examples pre {
margin-top: 0;
}
.marquee .author {
display: none;
}
.marquee-author {
float: left;
width: 90px;
text-align: right;
padding: 4px 5px 1px 0;
}
</style>
Just copy the codes similar to above from your HTML pages into a single separate text file without the <style></style> tags. You don't need any doc tags or anything at the top, no meta tags or anything at all just the raw CSS code itself.
The exception to the above would be if you have added any scripts to your site that gave you specific CSS code. When that happens you should put that CSS code where it tells you to rather than in a separate text file. Some scripts and software will create separate CSS files for you which you should leave as is rather than combining them. Doesn't hurt anything to do that as you can still reference them all in the pages.
When you put the code into a separate text file you would save the file with a .css extension not a .txt or .html which most text editors will allow you to do and you can create it right inside the HTML Editor too. Then just add a line like this into your <head></head> tags to let the pages know they need to use that CSS file(s):
<link href="yourcssfilename.css" rel="stylesheet" type="text/css" />
That pretty much is all there is to moving the CSS code to a separate file. Hope that helps and hollar if you need more assistance on that

Hi, and happy New Year, Mr. Smith!
I'm working on your css file now, and what I notice is, you have different font stacks in the two files I have saved here locally (worship and the hometemplate). I will combine them using the most comprehensive stack. Also, when creating font stacks, you have to separate the various fonts by commas, not semicolon.
Well, I'll keep you posted...
I'm working on your css file now, and what I notice is, you have different font stacks in the two files I have saved here locally (worship and the hometemplate). I will combine them using the most comprehensive stack. Also, when creating font stacks, you have to separate the various fonts by commas, not semicolon.
Well, I'll keep you posted...
Ha en riktig god dag!
Inger, Norway
My work in progress:
Components for Site Designer and the HTML Editor: https://mock-up.coffeecup.com
Inger, Norway
My work in progress:
Components for Site Designer and the HTML Editor: https://mock-up.coffeecup.com
So here goes...
If you open http://www.eikweb.com/stuff2/infosystems.html , you will find the three files that you have asked about so far, plus a css file which is being used for them all. You can navigate from the infosystems to the two other files.
The columns have been shortened a little, like the worship file I did some days ago. Take a look at the css file, styles.css, I have added a header section for each of the three pages because you have a different background image in each of them. Check also the header html sections.
I find your menu a bit bland to be honest. I used the built-in menu editor in the html Editor and created another menu, see http://www.eikweb.com/stuff/hometemplate2.html . (This file was based on an early version of that page, though, before you added the scrolling text.) Of course the colours can be changed. What do you think?
If you 'buy' the changes I have made, let me know, and I can zip it all up for you.
If you open http://www.eikweb.com/stuff2/infosystems.html , you will find the three files that you have asked about so far, plus a css file which is being used for them all. You can navigate from the infosystems to the two other files.
The columns have been shortened a little, like the worship file I did some days ago. Take a look at the css file, styles.css, I have added a header section for each of the three pages because you have a different background image in each of them. Check also the header html sections.
I find your menu a bit bland to be honest. I used the built-in menu editor in the html Editor and created another menu, see http://www.eikweb.com/stuff/hometemplate2.html . (This file was based on an early version of that page, though, before you added the scrolling text.) Of course the colours can be changed. What do you think?
If you 'buy' the changes I have made, let me know, and I can zip it all up for you.
Ha en riktig god dag!
Inger, Norway
My work in progress:
Components for Site Designer and the HTML Editor: https://mock-up.coffeecup.com
Inger, Norway
My work in progress:
Components for Site Designer and the HTML Editor: https://mock-up.coffeecup.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.