|
unit 7
Mar 6, 2015 1:41:49 GMT -8
Post by jillcarr on Mar 6, 2015 1:41:49 GMT -8
Wow. After trying to figure out why I am having such a problem with some things that I thought I knew, I realized that my concentration and focus has really been lacking. With that said, my adjustment to compensate for this issue is to allow more time to avoid that panic mode and I hope it works. The assignment went okay; although I couldn't get the gradient background to go across the three columns right. Probably because they are not flush to each other in my layout, but it looks nice. I really wanted to get this uploaded as I was getting too far behind. Thanks, Judy. gc.palomar.edu/34634/34634jcarr1683/3columnbackground.html
|
|
|
unit 7
Mar 7, 2015 1:09:24 GMT -8
Post by Judy Fontanella on Mar 7, 2015 1:09:24 GMT -8
You have a great start here. You just haven't finished. It looks like you started the "window shade technique" (large bottom padding and negative margin). You have a large bottom padding on all of your columns. However, they don't all have the negative margin. Also, you need a div that surrounds the three columns with a rule "overflow:hidden" set for it.
Just finish up and your columns should work well. You'll even be able to put different amounts of content in them and still have them end at the same place.
|
|
|
unit 7
Mar 8, 2015 11:36:05 GMT -8
Post by Brett Ludwick on Mar 8, 2015 11:36:05 GMT -8
Does it matter if the surrounding div rule is "overflow: auto" or "overflow: hidden"? Is that why I've never been able to get it to work, because I've been using "hidden"?
|
|
|
unit 7
Mar 8, 2015 16:22:42 GMT -8
Post by Judy Fontanella on Mar 8, 2015 16:22:42 GMT -8
For years, I've been using "overflow:auto" to make a surrounding div contain its floats. However, I was just watching a movie and the author said he preferred "overflow:hidden" - that is does the same thing. You will occasionally get a scroll bar with "auto", but he says not with "hidden." For the large majority of the time, both hidden and auto work about the same. For this Window Shade technique, you HAVE to use overflow:hidden. I've been using "hidden" there, because I was assuming that the technique really DOES have to hide the large bottom columns. I tried "overflow:auto;" and it definitely does not work. Here is a sample of that technique: artbytes.net/202/ClassFiles/Unit07/WindowShade.htmlThere are other reasons why that technique might not be working for you. I just accidentally had a colon, instead of a semi-colon at the end of a declaration, and that alone ruined it. Make sure that you are putting the declarations for the padding and margin in the rule for the columns. The overflow property goes in the column wrap. See my sample linked above. DO NOT depend on Dreamweaver to let you know if it's working. Dreamweaver does not render it correctly. Check it in the browsers to see if it's working or not. It's really quite easy.
|
|