bkelly

Hello Eric, I am having trouble understanding this. Your CSS code contains: I copied the code to my computer and added images such that they did not fill the horizontal space. When the section: #images { overflow:hidden; } Is present, the text, as in "I am content below..." is below the row of images. But when taken out, the text is to the right of the images. When I look up the overflow declaration, here for example: http://www.quirksmode.org/css/overflow.html The description does not seem to match the behavior. There are two things I am not understanding about the overflow thing. First: why use the # images stuff rather than putting the overflow:hidden inside the "$images img" phrase , and second: what is "overflow" really doing. Thank you.

Eric, That worked out, some features are dropped but I will work to understand how those features worked. The creative version is cool. I saved it to my computer and it works. That will take a bit to understand. jlhaslip, As I understand your post, simply insert the line p.following { clear:both; } into the htm code of the following paragraph. I tried that and saw no difference. I probably did not understand something there. Thanks to both for your suggestions.

I found some code to display a set of images. The problem is that I cannot figure out how to make the images in a section by themselves and to force the next paragraph to be below the images. I have tried adding a and a around the group of images and around the following paragraph to no avail. Here is the CSS code, currently in line rather than in a CSS file: and here is the code for a single image, duplicated once for each image: text below image. On my desktop computer at home the images are aligned vertically one at a time. On my laptop, with four images, they are aligned horizontally, take up about half the horizontal space, and the next paragraph fills in the blank space to the right of the four images. How do I get the four images to fill all of the horizontal space and the next paragraph to be clear of and below the four images. Thanks for your time.

Thelma, Wickham, jlhaslip, Virtual, and LSW, I think I understand the last three posts. Thanks. You have helped me resolve the initial problem and led me to much new information. I think I'll let this stop here and continue working on improving my site and expanding my knowledge of what you have shown me. Thank you for all the time you spent answering my questions. :) :) Bryan

It appears to me that if I define a paragraph style in my CSS, and use that style in a page, then I cannot put a sub paragraph inside the first one. Closing the sub paragraph appears to close out the CSS declaration/definition. Is there a legitimate method of embedding paragraphs within paragraphs in CSS?

Thelma, I intended to hide those lines in my post because they were not working. Wickham found that I left quote marks off the end of the link and that fixed one problem. Is there a way to center just one line within a paragraph? I wanted that line "Links to Local Golf Sources" to be centered within the borders of the paragraph. Can that be done? Wickham, Thanks for noting the missing quote. LSW, I didn't intend to hide anything as the web site shows when they get there. But I understand your comment and they viewers should should see the address before they go. I'll make my links as you suggest.

I created this class (I think its a class) in the css file to define a paragraph with a border. .paragraph_border { font-family: Verdana, Arial, Helvetica, sans-serif; font-weight: bold; font-size: 12pt; color: green; border-top: 2px solid blue; border-left: 2px solid blue; border-bottom: 2px solid blue; border-right: 2px solid blue; } This I used it with this paragraph in index.htm: Links to Local Golf Sources "The Golf Doctors" on Merritt Island can repair your clubs and provide the golf accessories you need. Check them out at 2137 N Courtenay Parkway. To check their web site click As shown, it works as expected. However, when I uncomment out any of the formatting code it disrupts the paragraph. The border is not placed correctly. What is going on here? Can this be made to work?

Eric, Wickham, jlhaslip, and virtual, Your help is much more than anyone could ask for or expect. I captured the files from Wickham and the link from Eric. I will be needing some time to go through them and understand what you have told me. Thanks so much for the time you have spent in my behalf. Bryan

I think I tried that. Here is the section from the CSS that I modified as I understood what you wrote as it looks now: ul.navbar { list-style-type: none; margin: 0; float: left; width: 9em } I removed the padding but saw little difference. It did not effect that empty box. The code that uses it now looks like this: > </pre> <ul> ... links removed from this location ... </ul>class="navbar"&gt As is, it is pretty close, but there remains an empty box to the left of all the links that has the characteristics I expect. The code is posted to my site and can be seen. I will read some more about those various parameters and see what I can learn. EDIT I removed the LINKBOX definition from the index.htm file and removed the box. The code now looks like this: > </pre> <ul> ... links removed from this location ... </ul>class="navbar"&gt I liked the box effect, but the text was not being put inside the box. It looks okay not, but I will read more about the box effect and see what I can come up with. So in summary, while I have a new toy to research and figure out, I do have what I asked for. Thanks for your help.

I must not be understanding something. It seems to me that when there are identifiers such as: > </pre> <ul> They make natural divisions. It seems like putting a around that section is redundant. Regardless, I edited index.htm and added divisions as I understand the reply. (Indicating I probably do not fully understand.) I tried looking at it on my computer and uploaded it to my site with identical results. I did not see any change in the display. Should I be changing the css file also? EDIT I have edited my css file a bunch trying things and not understanding everything. Maybe I have some things in there are are causing problem. I will include the test css file below. The index.htm file has no PDF or other such code. I think its code is fully visible on the web site so I won't post it here. /* A web page must have the following to reference this style sheet */ /* */ /* If it does, the use of the html tags that are defined here */ /* will invoke the characteristics defined for that tag. */ /* When the tag "body" is declared in a page, these */ /* characteristics will be applied to the page. */ body { padding-left: 11em; font-family: Georgia, "Times New Roman", Times, serif; color: purple; /* background-color: #C0C0C0 */ /* background="http://www.bkelly.ws/background3.gif" */ background-image: url(http://www.bkelly.ws/background3.jpg); } p {text-indent: 1cm} /* replace this navbar with the one below ul.navbar { list-style-type: none; padding: 0; margin: 0; position: absolute; top: 2em; left: 1em; width: 9em } end of original */ ul.navbar { list-style-type: none; padding: 1em; // added some padding here for separation margin: 0; float: left; width: 9em } h1 { font-family: Helvetica, Geneva, Arial, SunSans-Regular, sans-serif } /* ul = unordered list, the list items will not be numbered */ ul.navbar li { background: white; margin: 0.5em 0; padding: 0.3em; border-right: 1em solid black position: left } ul.navbar a { text-decoration: none } a:link { color: blue } a:visited { color: purple } address { margin-top: 1em; padding-top: 1em; border-top: thin dotted } table { border: 5px solid rgb( 000, 000,255); text-align : left; } td { border: 5px solid rgb( 100, 200, 100); padding:5px; text-align : left; } tr { text-align : left; } EDIT AGAIN (sigh, not getting anywhere fast) I found a tutorial on floats here: http://www.webreference.com/html/tutorial20/3.html and I added this section to my css file #LINKBOX { float: left; width: 40%; margin: 0.5em; background: #003399; border: solid thin #D7040B; color: #FFFFFF; } And I changed my navigation bar to look like this: ... my links go here ... class="navbar"> I did not detect any changes. Do I need to modify my file and put IDs in for every paragraph. Or maybe I have this so screwed up I ought to delete and start from scratch. LAST EDIT I don't know why, but when I put the changes on my site, it was not the same as in the directory on my computer. Now I am almost there. The ID = LINKBOX seems to work, and now the remainder of the page wraps around and back to the left below the box of links. But the border is a little box all by itself and is not around the links that I want in the box. Very strange to me. I tried editing the URL to my site per the post about spams but when I test it seems to direct me to some strange page. My site is www dot bkelly dot ws. It is okay to post like this? I have been here all morning and have other things to do so I will let this rest a few hours. Thanks for the ideas and help you have already provided.

That almost works in that it sets an indented area around the links, but it leaves the remainder of the page indented to the left. I have updated the page and the effect is present: http://ww w.bke lly.ws (edited URL per comments on spam as I understand the intent) and wow, that was a fast response. Thank you.

I am very new with CSS and slighly knowledgable with HTML. My goal is a simple web site that gets the point across. My CSS file has this section: ul.navbar { list-style-type: none; padding: 0; margin: 0; position: absolute; top: 2em; left: 1em; width: 9em } The index.htm file has this section: > </pre> <ul> ... several links are here... </ul> This is fine in that it creates a section on the left for links and the code wraps around it. The problem is that the entire page is indented on the left allowing for links all the way to the bottom. That means I lose a lot of real estate in the remainder of the page. I though the would reset the width back to normal. I tried changing the to class="navbar"> with no visible effect. What do I need to change to move the left margin back to the left side after the link area. if you want to see the page is it here: http://ww w.bke lly.ws Edited the URL per the comments on spam. Right clicking on it takes me to a site, but certainly not mine. I don't know what is going on here.