SitePoint Sponsor |
|
User Tag List
Results 1 to 9 of 9
Thread: Frame to CSS
-
Nov 7, 2007, 23:16 #1
- Join Date
- Nov 2007
- Posts
- 5
- Mentioned
- 0 Post(s)
- Tagged
- 0 Thread(s)
Frame to CSS
I have started designing my web pages using MS Frontpage and using Frames. then I saw many articles/advices that I should use CSS instead.
So, I found a 3-column CSS at http://www.pmob.co.uk/temp/3colfixedtest_explained.htm
and from there I created a test.css and test.htm files. See attached files (I saved them as TXT files because this site does not seem to allow css or htm file upload).
There are some problems:
1. Using Frontpage 2002, sp3, I opened the test.css and changed some
colors. At Normal view of test.htm to which test.css is linked, it shows
texts, not like preview. Normally Normal view shows a screen like
Preview, but you can edit the content. Why doesn't this work?
2. In preview screen, the left column shown the specified background
color only at the top portion where there is a text. Can that BG color
stretch all the way down?
3. When reviewed in Firefox 2.0.0.9, it does not show exactly like
preview. why?
4. I want to have the footer always at the bottom of screen and the
content within the main body scrolls if it is long. How can I do it?
5. I want to place hyperlinks in the left column, and the result of
clicking shows up in the main body. The result in the main body is a
htm file and it should be created with an external css link. It also has
hyperlinks and they show results, which should be also a htm and css
external link, in the main body, too. How to do these? I was told that I should create different pages for them. That is fine with me. but how to crete css pages where business name at the header and hyperlinks at the left column in such a way that they are consistent throughout pages and can be changed easily via CSS? When I type in some texts in test.css's header for example, it does not show up in test.htm. I am a beginner in CSS.
-
Nov 8, 2007, 05:27 #2
- Join Date
- Jul 2006
- Location
- Victoria, Australia
- Posts
- 4,122
- Mentioned
- 29 Post(s)
- Tagged
- 2 Thread(s)
Hi MTAKASHI, and Welcome to Sitepoint
The first three queries are to do with Frontpage's rendering in the preview pane, Basically Frontpage cannot be used to predict what the page will look like at all in browsers.
Frontpage is really really outdated now, and I highly reccomend using Dreamweaver if you are looking for a wysiwyg tool or using a good text editor with syntax highlighting like Crimson Editor (there are many free online tools)
4. I want to have the footer always at the bottom of screen and the
content within the main body scrolls if it is long. How can I do it?
http://www.pmob.co.uk/temp/fixedfooter_mine.htm
5. I want to place hyperlinks in the left column, and the result of
clicking shows up in the main body.
Create separate pages and load the whole page again,
That is fine with me. but how to crete css pages where business name at the header and hyperlinks at the left column in such a way that they are consistent throughout pages and can be changed easily via CSS?
Code:#leftnav a { color: green }
Code:<ul id="leftnav"> <li><a href="#">A</a></li> <li><a href="#">B</a></li> <li><a href="#">C</a></li> </div>
Hope it helps
-
Nov 8, 2007, 05:53 #3
- Join Date
- Jan 2003
- Location
- Hampshire UK
- Posts
- 40,556
- Mentioned
- 183 Post(s)
- Tagged
- 6 Thread(s)
Originally Posted by mark
http://www.pmob.co.uk/temp/fixed-header-footerx1.htm
MTAKASHI if you want the header, footer and navigation html to be duplicated on many pages then you should also look at Server Side Includes (SSI).
http://uk2.php.net/include/
http://httpd.apache.org/docs/1.3/howto/ssi.html
Also read the CSS faq as it contains a lot of information that you will need to know before you can embark on all of this if you want to do it the right way. Then look in the html forum and read the three stickies at the top to understand about doctypes and valid code.
There are no quick fixes if you want to do this right and you must understand the medium you are choosing. Frontpage users often think its their right to put web pages up with little effort and that's OK for the kid in his attic, but if you want a professional product then you need a professional approach and take the time to learn the basics.
CSS is about separating presentation from content so you should avoid using presentational mark up such as font tags (align="") and the like and i notice you have peppered some of these in the mark up already.
The marquee tag isn't well supported cross browser and is disliked by 90% of web users because it is distracting so be warned if you use it. I also note that you have lost the doctype from your code and have also mixed in html within your stylesheet. These are fundamental issues that you need to learn first or you will just keep running into problems.
The faq as I mentioned above will cover most of these issues so take the time to study.
Hope that helps
-
Nov 13, 2007, 13:19 #4
- Join Date
- Nov 2007
- Posts
- 5
- Mentioned
- 0 Post(s)
- Tagged
- 0 Thread(s)
Repeated header, nav, footer
Thanks for your reply. Re: your example of #leftnav, I understand the css controls the appearance of the leftnav.. color, font, etc.... but in my case and in many cases I see at various web sites, the header, nav bar and footer contain same contents, such as the same logo and company name at the header, same set of href's in nav bar, and a copyright notice at the footer for example. If I keep generating new pages with different main text body, but the same header, nav bar and footer, then, if I want to modify the logo, or any element within the header, nav bar and footer, I have to go to and change all separate pages. Is there anyway to simplify this? For example, any way to create a header.htm file and it shows up in all pages which specify that file as a header, so that if we need to change the content of the header, I only need to change that one file header.htm?
-
Nov 13, 2007, 13:26 #5
- Join Date
- Nov 2007
- Posts
- 5
- Mentioned
- 0 Post(s)
- Tagged
- 0 Thread(s)
Thanks for your reply. I studied a tutorial of css at http://www.westciv.com/style_master/...ial/index.html, and I learned a lot there.
About SSI, is this the only,or best way to repeat a header, footer, etc thorough multiple pages? I know nothing about SSI. Any tutorial I can study?
-
Nov 13, 2007, 13:28 #6
- Join Date
- Jan 2003
- Location
- Hampshire UK
- Posts
- 40,556
- Mentioned
- 183 Post(s)
- Tagged
- 6 Thread(s)
If I keep generating new pages with different main text body, but the same header, nav bar and footer, then, if I want to modify the logo, or any element within the header, nav bar and footer, I have to go to and change all separate pages. Is there anyway to simplify this?
You can use Server Side Includes (SSI) which are independent files that are called into the page on loading. You just update the one file and your whole site reflects the changes made. You just make individual html files for the common sections of your sites such as headers, footers and nav.
Read the two links I put on my previous post for more information and then google "SSI" for millions of more examples
-
Nov 13, 2007, 14:24 #7
- Join Date
- Jan 2003
- Location
- Hampshire UK
- Posts
- 40,556
- Mentioned
- 183 Post(s)
- Tagged
- 6 Thread(s)
About SSI, is this the only,or best way to repeat a header, footer, etc thorough multiple pages?
The only other methods are to use and editor such as Dreamweaver that can create pages based on a template. This allows you to make global changes by adjusting just the template. The downside is that you then need to upload all the pages of the site that are affected unlike includes where you just update the includes themselves.
-
Nov 26, 2007, 21:59 #8
- Join Date
- Nov 2007
- Posts
- 5
- Mentioned
- 0 Post(s)
- Tagged
- 0 Thread(s)
CSS and use of tables
I have created a CSS file and header, navbar and footer htm files as well as shtml files for insertion. Some of my web pages I created sometime ago utilized Frames and tables to list projects, then, when you click any one of the listed projects, it goes to the selected project page, which shows a series of thumbnail pictures and clicking it shows a large image on the same page. Please see attached files. I can go ahead to revise these files and remove Frames and then set up to insert the htm file into a shtml file. Is it still appropriate to use tables in the similar way for these purposes? Or any other better ways to achieve the same? If possible, I would like to control each box(table) sizes showing photos and and their layouts globally. Is is possible? Is it what CSS can do?
-
Nov 27, 2007, 18:12 #9
- Join Date
- Jan 2003
- Location
- Hampshire UK
- Posts
- 40,556
- Mentioned
- 183 Post(s)
- Tagged
- 6 Thread(s)
Hi,
Its hard to see from those empty html pages exactly what you want but I would suggest you look around and see how others have made image galleries and then you can get an idea of what can be done.
You can create a gallery without tables but it depends on exactly what effect you are going for. If its a simple list of images and captions and description then css can do this easily.
CSS play has a lot of advanced galleries that show the sort of thing that advanced CSS can do.
You may need to break your questions down into one topic at a time as I can only answer this in general terms. It does seem however that firstly you should look into CSS in a little more detail so that you understand what you are trying to achieve and learn the means to accomplish it.
Sorry to be so vague
Bookmarks