Hi Barry, Maybe you didn't see my last post? I got the 'big' list all finished with the markup and Pat's CCS//example. I stripped all the doc code and actually got my tags correct for the nested list going in/out for each surname and people's names. I started off with 110 errors because I missed a few tags at first which threw everything off, but I stuck with the task until it validated. It only took 2 days LOL...working a little at a time. Think I'll permanently remember "close ul close li" Surname "open ul" then "open li" to end of the full names for that surname, and again, "close ul close li" Surname "open ul" etc etc. That's my longest list ...and hope I never do another long one. LOL The questions I raised, in part, were related to the second shorter list of NOT related people. If I use a div class /div on the big list, but only a div then ul (a regular list) for the second list, the second list behaves as if it IS part of the div class list. I wondered if that was how all lists will behave now, even if the markup does NOT use the bookindx class? Seems if I don't use the div class markup, it should be a regular list? Yes? No? If I can't use a 'regular old list' on the same page as the div class bookindx list, I think I'll just move the shorter list to a new page. Second, on the Big List, I need some padding between the right / left columns, to separate the content a little more.... but I don't know how to add that to the CSS. The link to Pat's Example with the CSS is in this same thread. I'm sorry you did extra work, Barry. Judy

http://www.css-layouts.org/florian-family/book-index2.html within the template. I would still advise you to change the deep pink against the dark blue background to white or a very pale shade of the same color you are using. It is not easily read but again it is your choice. pat ========== Hi Pat, Your example really helped. Thank you for the CSS/example page. I've mostly been working on conversion. I figured I can go back and tweak colors, etc. before I upload. Template questions... 1. Before the /body and /html.... Why does the template 'lose' one of the /div (close div) tags sometimes? It either loses the one above the 3rd background comment OR sometimes above the 2nd background comment line. I don't hand copy the template... I use the program such as with the template opened, I do Save As...and name it for my new page. .So I'm not doing something that changes the template code. 2. The template OR new pages often loses the Bottom _include. This can happen at any time, even without adding content. Book Index list ..... About converting the Book Index list items, after working on it several times (starting from 110 errors ugh), the page I did validated. Really pleased. But I have some questions.... 1. In Normal View in Frontpage, the page loses everything except the brown background. Why? HOWEVER, switching to Preview everything IS there and like I said, the code validates. It almost seems something is 'confusing' the program-- everytime I open the page, things are gone but only in Normal View. I re-validate immediately and the code is okay. 2. Sometimes AFTER Template-SaveAs and I add content and Save it, the new page loses the Top _include OR the Bottom _include. The _include code appears exactly like it was, but it starts to throw a Component Error and doesn't show the include... I re-insert it using the "insert component" from the tool bar and it works again. Any idea why this happens? 3. On class .bookindx regarding the 40% width... Can that be 45% or even 48% ? 4. What piece of .bookindx would put more padding between column 1 and column 2? Or what line do I add to the CSS -- and WHERE do I put it -- to add padding between Col 1 / Col 2? Reason: The page numbers for names in Column 1 are right up against the first name in column 2. So looking across, it might look like list item Anna (Dager) Lane, 4, 6-7, 10, 41, 45-47, 75, [one space]Lillie (McClellan) Lane [the list item in 2nd column] 5. Lastly, with the div class bookindx used in a page and enclosed in div /div, then, why won't just a regular ul work on the same page? Why does the regular ul list "behave" as if it is part of the div class bookindx even with that div closed, and no class put on the other ul? Is there any way to force a second list to make a separate listing (1 or 2 columns, while above it is the first div class bookindx ? Like div class bookindx ul list items appearing in 2 columns rest of code to end / exit this list end div space open div (no class put here) ul list items of a separate list in 2 columns (items I don't want in the first list) rest of code to end / exit this list close div How would I do this 2nd list? Does a list 2 need a completely different class name to work? Also does this mean I will always need to present lists by using bookindx ... or can I make regular ul on other pages? Judy

When I view my web page in various browsers I have problems getting the cursor to point to the page I want (i.e. it will connect with the link immediately below). I've just uploaded my web page, and see that a caption I placed as an absolute layer to the image is now not in the right place - is this because of the Rootsweb banner pushing the container south? My page title and background image has also disappeared. This can be viewed at http://freepages.genealogy.rootsweb.ancestry.com/~boltongenealogy/index4.html . Valerie

>I've just uploaded my web page, and see that a caption I placed as an >absolute layer to the image is now not in the right place - is this because >of the Rootsweb banner pushing the container south? My page title and >background image has also disappeared. > >This can be viewed at >http://freepages.genealogy.rootsweb.ancestry.com/~boltongenealogy/index4.html >. ============== Quickie look shows this <.....div id="container"> <....div id="masthead"> <....p class="logo"> <img alt="18th century Churchgate" height="227" src="<view-source:http://freepages.genealogy.rootsweb.ancestry.com/~boltongenealogy/view-source:http://freepages.genealogy.rootsweb.ancestry.com/%7Eboltongenealogy/17thcentchurchgate.jpg>17thcentchurchgate.jpg" width="300" /></p> <...p class="title"><...id="container">Index</p> What is this for<...id="container"> pat

Judy, Looking at your first set, as shown on http://freepages.family.rootsweb.ancestry.com/~florian/zcurr-css-test-2013/p at-template2_judy-play.html: Lane, 40 Allen Wrench Lane, 48 Cathy Coughing Lane, 41-42 Mary Quite Contrary Lane, 42 Zenia Zoo Lane, 40-43 It looks to me like a three-column table works better; page numbers in their own column. I'd set up the HTML for the table cells like this: <tr class="bkind"> <td class="bkind1" ROWSPAN=4>Lane, 40</td> <!-- How to get page number to right? --> <!-- It spans four rows because that's the number of Lane entries --> <td class="bkind2"> Allen Wrench Lane</td> <td class="bkind3"> 48</td> </tr> <tr> <!-- No 1st column, already taken --> <td class=" bkind2">Cathy Coughing Lane</td> <td lass=" bkind3">41-42</td> </tr> <tr> <td class=" bkind2">Mary Quite Contrary Lane</td> <td lass=" bkind3">0-43</td> </tr> ... etc. The first column spans several rows, thus the bkind1 class cell (td) only appears in the first row of the surname set. HTML default is vertical alignment of table cells to be "middle"; use CSS to change if desired. After doing the HTML, I'd set up the CSS like this: tr.bkind {border-top: solid 5px; /* distinctive border */ } .bkind1 {font-size= 110%; /* bigger? */ font-weight: bold; /* bolder, 200? */ vertical-align; top; /* ? */ } .bkind2 { /* whatever */ } .bkind3 {text-align: right; } The bkind class for the first table row of the set is to visually reinforce a change of surnames. The bkind1, bkind2 and bkind3 classes style those cells as desired. I like to specify font sizes in a (maybe) different way. First, define a size in em for the body, and then vary from that standard size by percentages for specific elements, classes or divs. Any help? -rt_/) PS -- To do as a nested list, HTML: <ul> <li class="bkind1">Lane, 40 <ul> <li class="bkind2">Allen Wrench Lane, 48</li> <li class="bkind2">Cathy Coughing Lane, 41-42</li> ... etc. </ul></li> CSS stays much the same. ------------------ Message: 3 Date: Mon, 21 Oct 2013 02:00:38 -0400 From: JFlorian <cageycat@gmail.com> Subject: [FreeHelp] Need ideas how to do CSS and html markup for a 'Book Index'? To: "LIST_freepages-help@rootsweb.com" <freepages-help@rootsweb.com> Message-ID: <CAE5hz-C+hq-5hzNET9ektdvi5Uvq3mbpzUWgxmCpQuEM=me0WA@mail.gmail.com> Content-Type: text/plain; charset=ISO-8859-1 This is in the next folder I need to convert. One page is a 'book index' that lists surnames as headers, then full names, and page numbers. (Original Page:) http://freepages.family.rootsweb.ancestry.com/~florian/lanefam/lane_book1.ht m The surname headers are bold. All the text was "2". This was from one of my first web pages, so I probably copied it from MS Word. Every line has font markup which I need to remove. I'd still like to keep the basic structure/look. I don't want to use ul for this. Not sure if I can manage transferring it to side by side presentation, such as a 2-cell table... I can figure that out after I know how to do the CSS for bold, font etc. I'm wondering what might be the best way to do this with CSS to limit how much markup I need, while keeping a similar look. How can I fix what's below to work in my css file? bkind1 would be for surnames, bkind2 for list of names. Not sure what font-sizes to use yet. I'm just learning px/em sizing, so any help on that will be appreciated. This works on W3 'Try It' but when put in my CSS file it doesn't quite render right... the surnames are not bold and look smaller than the full names. I'm using Frontpage2000 and Chrome. Here is uploaded example and CSS file... http://freepages.family.rootsweb.ancestry.com/~florian/zcurr-css-test-2013/ then click on the html page. Only pay attention to the Book Index at the top (rest are tables / markup for things from Pat's CSS so those are okay). My Book Index CSS. I used div class= in the markup for each one...is that right? Without divs, all of it became quadruple the intended size. } .bkind1 { font-family: Courier New,adobe-courier,Courier; font-weight: bold; font-size: 0.875em; } .bkind2 font-family: Courier New,adobe-courier,Courier; font-size: 0.073em; } Any suggestions about em sizes, and ways to reduce markup would be greatly appreciated. Judy ------------------------------ To contact the FREEPAGES-HELP list administrator, send an email to FREEPAGES-HELP-admin@rootsweb.com. To post a message to the FREEPAGES-HELP mailing list, send an email to FREEPAGES-HELP@rootsweb.com. __________________________________________________________ To unsubscribe from the list, please send an email to FREEPAGES-HELP-request@rootsweb.com with the word "unsubscribe" without the quotes in the subject and the body of the email with no additional text. End of FREEPAGES-HELP Digest, Vol 8, Issue 163 **********************************************

At 02:00 AM 10/21/2013, you wrote: >This is in the next folder I need to convert. One page is a 'book index' >that lists surnames as headers, then full names, and page numbers. >(Original Page:) >http://freepages.family.rootsweb.ancestry.com/~florian/lanefam/lane_book1.htm http://www.css-layouts.org/florian-family/book-index2.html within the template. I would still advise you to change the deep pink against the dark blue background to white or a very pale shade of the same color you are using. It is not easily read but again it is your choice. pat

At 02:00 AM 10/21/2013, you wrote: >Any suggestions about em sizes, and ways to reduce markup would be greatly >appreciated. Very, very rough but it will give you an idea http://www.css-layouts.org/florian-family/book-index.html Play around with it and see how it works. pat

At 02:00 AM 10/21/2013, you wrote: >I'd still like to keep the basic structure/look. I don't want to use ul >for this. Not sure if I can manage transferring it to side by side >presentation, such as a 2-cell table... I can figure that out after I know >how to do the CSS for bold, font etc. Judy, your book index is actually a list and should be structured as such. If you don't like the presentation of the list, then you change it by using your style rules to make it "look" like you want it to. I don't have time to work with it until later today or tomorrow but this might help you. http://alistapart.com/article/taminglists/ So you remove the list markers remove the indents remove/add margins add styling and you have exactly what you want in the proper format. If you want a two column list and tables work more easily for you then use a two column table with no borders. The hardest part may be splitting the list at the proper point. More later, pat

This is in the next folder I need to convert. One page is a 'book index' that lists surnames as headers, then full names, and page numbers. (Original Page:) http://freepages.family.rootsweb.ancestry.com/~florian/lanefam/lane_book1.htm The surname headers are bold. All the text was "2". This was from one of my first web pages, so I probably copied it from MS Word. Every line has font markup which I need to remove. I'd still like to keep the basic structure/look. I don't want to use ul for this. Not sure if I can manage transferring it to side by side presentation, such as a 2-cell table... I can figure that out after I know how to do the CSS for bold, font etc. I'm wondering what might be the best way to do this with CSS to limit how much markup I need, while keeping a similar look. How can I fix what's below to work in my css file? bkind1 would be for surnames, bkind2 for list of names. Not sure what font-sizes to use yet. I'm just learning px/em sizing, so any help on that will be appreciated. This works on W3 'Try It' but when put in my CSS file it doesn't quite render right... the surnames are not bold and look smaller than the full names. I'm using Frontpage2000 and Chrome. Here is uploaded example and CSS file... http://freepages.family.rootsweb.ancestry.com/~florian/zcurr-css-test-2013/ then click on the html page. Only pay attention to the Book Index at the top (rest are tables / markup for things from Pat's CSS so those are okay). My Book Index CSS. I used div class= in the markup for each one...is that right? Without divs, all of it became quadruple the intended size. } .bkind1 { font-family: Courier New,adobe-courier,Courier; font-weight: bold; font-size: 0.875em; } .bkind2 font-family: Courier New,adobe-courier,Courier; font-size: 0.073em; } Any suggestions about em sizes, and ways to reduce markup would be greatly appreciated. Judy

At 08:59 AM 10/20/2013, you wrote: >Thanks Pat. But I have a dumb question. In Step 1's "Instructions", the >form we are to fill out asks for "Your URL". Is this the URL of my >Freepages website's homepage? If I have a personal URL I'm not aware of it. Yes it is the url of YOUR freepages Home PAge. In my case it is http://freepages.genealogy.rootsweb.ancestry.com/~gearyfamily/ Pat Pat Geary Working With Rootsweb FreePages Accounts EBook (free) http://freepages.genealogy.rootsweb.ancestry.com/~gearyfamily/rootsweb-freepages-ebook.html

Message: 2 Date: Sat, 19 Oct 2013 10:52:47 -0400 From: Pat Geary <pat@the-gearys.com> Subject: Re: [FreeHelp] Guestbook Thanks Pat. But I have a dumb question. In Step 1's "Instructions", the form we are to fill out asks for "Your URL". Is this the URL of my Freepages website's homepage? If I have a personal URL I'm not aware of it. >> I would like to add a simple guestbook to my web page - can anyone help >> please? > > http://freepages.genealogy.rootsweb.ancestry.com/~gearyfamily/create-rootsweb-guestbook.html > > pat

I would like to add a simple guestbook to my web page - can anyone help please? Valerie

At 10:37 AM 10/19/2013, you wrote: >I would like to add a simple guestbook to my web page - can anyone help >please? http://freepages.genealogy.rootsweb.ancestry.com/~gearyfamily/create-rootsweb-guestbook.html pat

Judy, I've removed the inline td style="width:33%" and placed it it the CSS. http://countjustonce.com/test/florian-table-1.html The thing to note about declaring widths in table cells, is that it/they will only be respected by the browser provided that the cell contents in any column allow it. Otherwise the browser will provide widths as close as possible to what you declare. In the case of your 3 columns, the browser will render each column, i.e. each of the 3 td's in the row, equally at 33% each. Should an image in a column (in any row) exceed the width declaration the browser will alter its rendering to accommodate it, and the width of all the cells in a column will change accordingly. Something you need to remember when deciding on the width of your table, is what it will look like when displayed on wide-screen displays. It may look OK in a 1024px window, but in a 1600px window it could look "scawny". If you have the table within a content div, then the width of that div will control the tables width when declared as 100%. So, ensure the content div has a max-width declared. Barry --------------------- On Fri, 18 Oct 2013 15:51:34 +1300, JFlorian <cageycat@gmail.com> wrote: > Yes, I think what you did here > http://countjustonce.com/test/florian-table-1.html looks more > 'balanced'. > > But I'm still confused about this td width issue, right now not specified > in CSS for my class=table. > > I notice on yours, Barry, you wrote td style="width:33%" Am I correct or > mistaken that td width is not specified in your style? I also notice you > only use the td style="width:33%" on the first 3 td instances...is that > because the tds below don't specifically need told what to do after the > top > 3 tds? > > I'm trying to understand what parts to keep of an original table and what > parts to change, and in what way I need to change the CSS. > > When I took a nap, I was dreaming about how to do table markup--LOL. > > Judy > ------------------------------- > To unsubscribe from the list, please send an email to > FREEPAGES-HELP-request@rootsweb.com with the word 'unsubscribe' without > the quotes in the subject and the body of the message

Judy, I've had a look at the example posted by Pat G, and have assumed that the text identifying the images in the cells above is OK to to be centered, but it is the text referring to images in cells to the left or right that you would like to be left aligned. To do that, put text you wish to left align in <p> tags and add the following to the CSS:- .table td p { text-align:left; } http://countjustonce.com/test/florian-table-1.html Barry --------------------- On Fri, 18 Oct 2013 15:04:28 +1300, JFlorian <cageycat@gmail.com> wrote: > I'd want the images to center and text align left. Is this impossible > with css?

Judy, I suggest you forget about the <strong> tag and add another class to the the <p> tag, e.g. <p class="center strong"> The CSS becomes - .center { text-align:center; } .strong { font-weight:bold; } Barry -------------------- On Fri, 18 Oct 2013 09:01:39 +1300, JFlorian <cageycat@gmail.com> wrote: > On links presented one after another (not in html "list"), and I use p > class="center" and I want strong, I could just add both tags to front and > end of every link. > > But Validator complained and moved 10 of the 'end' /strong tags to the > bottom, after the links presented. As I looked it over, it seems silly > to > put the tags on every line. > > Is there an easier way? Can I combine the p center AND strong, adding > that markup just ONCE for all the links given? > > Judy > ------------------------------- > To unsubscribe from the list, please send an email to > FREEPAGES-HELP-request@rootsweb.com with the word 'unsubscribe' without > the quotes in the subject and the body of the message

Yes, I think what you did here http://countjustonce.com/test/florian-table-1.html looks more 'balanced'. But I'm still confused about this td width issue, right now not specified in CSS for my class=table. I notice on yours, Barry, you wrote td style="width:33%" Am I correct or mistaken that td width is not specified in your style? I also notice you only use the td style="width:33%" on the first 3 td instances...is that because the tds below don't specifically need told what to do after the top 3 tds? I'm trying to understand what parts to keep of an original table and what parts to change, and in what way I need to change the CSS. When I took a nap, I was dreaming about how to do table markup--LOL. Judy

As a follow up, would adding td classes help to control my tables? Such as shown at the bottom of this page: http://stackoverflow.com/questions/7613541/css-adjusting-table-cell-width If so, would I also use a small percent on td like they show? (if so, what? still 1px ?) Would I delete that solid #ccc on the td shown below? Then just change id date action to class names I prefer. Here is that part of theirs: } .table td { border: 1px solid #ccc; } .id, .date, .action { width:1px; } Until I get the CSS right, I'll skip converting more tables. Judy

You have already set a style rule for the td to text-align to the left so applying the class to center the image is going to be ignored. pat === I think what has me most confused in switching to CSS is how I'm used to doing tables. Unsure how to describe: I prefer the ability to make content go where I want... so I might center images, but still have text align left. Or if the image fits the cell fairly well, I just let it be aligned left also. Or, on captions, both image/caption are centered. So like in your example, http://www.css-layouts.org/florian-family/allen_family_home.htm I'd want the images to center and text align left. Is this impossible with css? Could you go over with me exactly what pieces of a table I'm supposed to Find/Replace? I have some long plain data tables to convert... already messed up one of them but still have the original so I can try it again. I've been doing pretty good with converting pages, and learning how to apply the CSS. I'm better able to spot what's wrong if I mess up non-table pages. So I don't want "over 3 row/3 column" tables to be obstacles in converting my site. Judy

http://www.css-layouts.org/florian-family/allen_family_home.htm Your current style rules do NOT have a width specified for the td tag. pat === Hi Pat, Does this mean I did shorter tables 'wrong' too? Cos 2 row and 3 column tables have worked and validated without specifying td width. If I want 100% table size, but cells to adjust to fit the content, how do I do that? Column 1 might be 10% on one table, but 33% on another table, etc. All my tables are different from another table. OR, if Frontpage already has <...td width="whatever%"> can I just leave all those, and not specify any td width in the CSS? Judy