WebSite Redesign/ReDo Page 6
Design Continuation... page 6
Columns Description
We went searching for some code to scroll individual columns
on our Web Pages... and we found this;
Stu Nicholls masterpiece from way back in 2005!! We experienced some of the same
scrolling problems that were discussed at the
CSSCreator forum -but- here 7 years
later we do believe that most of them have been corrected.
CSSPlay
We would like to talk about the code as we are creating our new Web Page -which- will not necessarily be a copied version of Stu's -but- a modified Blend using coding ideas from Stu's. This Gentleman has put together some really interesting code. We find it fascinating and expect to learn one heck of a lot. Didn't realize one could do some of the things he does!! This person is really, really knowledgable.
We have our first four files set up and the prelims have been accomplished. This one is going to be Grape -or- Purple. Depends on how well we can edit the colors. At this time it is more like Purple. Need to work on getting our colors more accurate... -but- then we need more "UN-Kitten-Interrupted" time!! She always seems to 'jump' up on our keyboard at the worst time!!
The other item that we want to incorporate is
TopStyle 4
We purchased it months ago and still have not used it.
We really, really like Homesite
and giving it up will be very difficult. We tried a trial version of
TopStyle
once and
was not totally happy with all the changes and differences. Which may mean that we will
use both!! -But- first we have to get going on
TopStyle.
The purchase money for
TopStyle
came from
our inheritance so, in honor of our Mother and Father, we need to properly use it.
(Incidentally, we did
use a "Preliminary" version of
TopStyle
in our Homesite. It included
TopStyle
Lite version 3.1. -But- it was different.
)
Some CSS rules??? -or- attempts at clarification.?
CSS uses existing HTML tags and allows redefinition of existing tags.
When features common to CSS1 and CSS 2.1 are defined differently, it is recommended
to follow the definitions in CSS 2.1.
CSS1 -or- CSS2 -or- CSS3... which??? Two main things.
What you use to write your code and what Browser you,
or your Viewers, use to view the Web Page(s) that you produce. Nothing else magical to specify which
is to be used.
W3Schools CSS Selector Reference
CSS Browsers
- User defined (browser prefs !important - [not Google Chrome!])
- Inline style sheet (style attribute on HTML node)
- Internal style sheet (<style> in <head>)
- External style sheet (@import)
- External style sheet (<link>)
- External style sheet (@import inside <link>)
- User defined - (browser prefs - [not Google Chrome!])
- Browser default - (shipped with browser)
PS: I was inferring !important was missing from 2-8. So User defined appears twice. Once with important, the second time without it. So user defined is in essence second lowest. The !important can naturally be applied at any level.
Rather than thinking of it in terms of most important and least important, think of it as cascade order. All the styles are applied, but the last applied one is the one which you see. Styles are applied in the following order:
- Browser default
- External style sheet (
linkor@import) - Internal style sheet
- Inline style
Within any one of the first three, styles are applied from least specific to most specific
(then from top to bottom if the most specific can't be determined). So a tag-selected style will
be applied before a class-selected style, so if they disagree about what style should be applied,
the class-selected one will win. There is no rule about whether link or
@import should be applied first, so they are mixed together and the
least-specific-to-most-specific rule applies.
!important makes a less specific style get applied after a more specific one, and
an external style sheet style get applied after an internal one or an inline style. I would advise
against using !important wherever possible though, as it can cause some pretty
confusing results.
No, !important always wins over inline styles unless they are !important themselves.
So it does... corrected.
Refer:
StackOverflow
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui.