Lost 'bold' effect on link
in [CSS]
|
From: Josiah Jenkins on 18 Nov 2009 20:27 Having just found this ng (although I recognise many of the names from c.i.www.a.h when I was looking for help some months back), I've just worked my way through around a year's worth of posts. Amongst the many snippets of useful info I found was : Dust_Me selectors for Firefox, which I've now installed, run in spider mode and have removed the unused selectors. I don't know whether it's related to this or I changed something previously, and didn't notice this at the time, but the text in the header of my page (it's a link) used to go bold on a mouseover . . . not now. How do I restore the effect ? Line 147 in the css (unchanged) ..headline { font-family: "Times New Roman", serif; color: #000000; font-size: 24pt; font-weight: bold; font-style: oblique; letter-spacing: 1px; word-spacing: 3px; padding-top: 20px; padding-left:150px; } And the URL : http://www.ian-stewart.eu/ All the 'deleted' selectors are at the bottom of the stylesheet (commented out) if that's of any help. Obliged for any assistance. PS. I confess to having started off with a 3-panel template, http://www.freecsstemplates.org/preview/baseline, and have hacked it to bits to get to what I have to-day, hence all the unused selectors (25) which were floating about. I know, I know, I did it the wrong way round ! -- http://www.ian-stewart.eu
From: dorayme on 18 Nov 2009 21:15 In article <2u59g5l4k2cdg221ocae89rkhf369948vn(a)4ax.com>, Josiah Jenkins <josiah-jenkins(a)somewhere_else.invalid> wrote: > Having just found this ng (although I recognise many of the names > from c.i.www.a.h when I was looking for help some months back), > I've just worked my way through around a year's worth of posts. > > Amongst the many snippets of useful info I found was : > Dust_Me selectors for Firefox, which I've now installed, run in > spider mode and have removed the unused selectors. > > I don't know whether it's related to this or I changed something > previously, and didn't notice this at the time, but the text in the > header of my page (it's a link) used to go bold on a mouseover . . . > not now. > > How do I restore the effect ? Put your hover after your visited. -- dorayme
From: Josiah Jenkins on 18 Nov 2009 22:36 On Thu, 19 Nov 2009 13:15:25 +1100, dorayme <doraymeRidThis(a)optusnet.com.au> wrote: >In article <2u59g5l4k2cdg221ocae89rkhf369948vn(a)4ax.com>, > Josiah Jenkins <josiah-jenkins(a)somewhere_else.invalid> wrote: > <sniP > >> . . . the text in the header of my page (it's a link) used to go bold >> on a mouseover . . . not now. >> >> How do I restore the effect ? > >Put your hover after your visited. As easy as that ? Thank you. Strange thing is that the sidebar menu links were working as I wanted and the sequence was also : link, hover, visited. Which now begs another question, I've just noticed that there were two almost identical entries in the css. On Line 101 and Line 292 One had : font-size: 90%; which I seem to recall I reduced from 100% to get the sidebar text to fit within the column. I've removed one of these and everything still appeared to be OK here on my machine. (I've got wamp server installed to check pages when I've no Internet connection) And I suddenly realised that I could increase the font-size from 13pt to 15pt for the tables. I might be starting to finally get my head around this ! (It's a *very* old head !) I've now uploaded (and validated) the revised css. The page at : http://www.ian-stewart.eu/irs_freeware.php shows the revisions. Thanks again for the help. -- http://www.ian-stewart.eu
From: C A Upsdell on 18 Nov 2009 23:35 Josiah Jenkins wrote: > I don't know whether it's related to this or I changed something > previously, and didn't notice this at the time, but the text in the > header of my page (it's a link) used to go bold on a mouseover . . . > not now. You may want to rethink making the text become bold on :hover. The CSS specification says: "User agents are not required to reflow a currently displayed document due to pseudo-class transitions. For instance, a style sheet may specify that the 'font-size' of an :active link should be larger than that of an inactive link, but since this may cause letters to change position when the reader selects the link, a UA may ignore the corresponding style rule." The browser may therefore legitimately decline to make the text bold on :hover. Changing the colour and/or adding an underline on :hover would be better.
From: dorayme on 19 Nov 2009 02:20
In article <9kc9g59611kka0sc3vb2224rkl5r5u02h9(a)4ax.com>, Josiah Jenkins <josiah-jenkins(a)somewhere_else.invalid> wrote: > On Thu, 19 Nov 2009 13:15:25 +1100, dorayme > <doraymeRidThis(a)optusnet.com.au> wrote: > >In article <2u59g5l4k2cdg221ocae89rkhf369948vn(a)4ax.com>, > > Josiah Jenkins <josiah-jenkins(a)somewhere_else.invalid> wrote: > > > <sniP > > > >> . . . the text in the header of my page (it's a link) used to go bold > >> on a mouseover . . . not now. > >> > >> How do I restore the effect ? > > > >Put your hover after your visited. > > As easy as that ? > > Thank you. > I agree with C A Upsdell about the advisability of doing this. The text can 'jump about' to accommodate a bigger text object for bold. The trouble with bigger things suddenly happening is that they can affect other things to move aside to accommodate and it then becomes a bit too much of an effect! (For what it is worth, I tend to use a simple change of colour, I am a sucker for blue for link, red for hover and green for active, please don't tell anyone, just a little private quirk). > Strange thing is that the sidebar menu links were working as > I wanted and the sequence was also : link, hover, visited. > > Which now begs another question, I've just noticed that > there were two almost identical entries in the css. > On Line 101 and Line 292 > What happens with some CSS sheets is that they grow by trial and error. Something does not work so something is repeated lower down so it overrules something after the original instance and the original is meant to be deleted to see if there is yet other effects but someone either forgot or tried to play it "safe" now that things were happening as wanted there and then. > One had : font-size: 90%; which I seem to recall I reduced > from 100% to get the sidebar text to fit within the column. > > I've removed one of these and everything still appeared to be > OK here on my machine. (I've got wamp server installed to > check pages when I've no Internet connection) > > And I suddenly realised that I could increase the font-size from > 13pt to 15pt for the tables. > Best to get rid of all those units for font-size. Use em or %, pts are for printing and do not relate to screens in useful ways for authors. > I might be starting to finally get my head around this ! > (It's a *very* old head !) > > I've now uploaded (and validated) the revised css. > The page at : http://www.ian-stewart.eu/irs_freeware.php > shows the revisions. > - Some remarks that might be useful to you in the long run, (no particular order) - You might google up for issues to do with Verdana ("problems with Verdana" or some such phrase) - The problem with * { margin: 0; padding: 0; } is that you then have to make sure you set all relevant margins and paddings. You have to wonder a bit whether this is worth it. Perhaps the more modest body {margin: 0;...} might suffice. - Best not to use px for font-sizes, one reason being that some browsers make it then very hard for a user to up the text to suit the users eyesight. - You don't have to put in things like: font-weight: bold; font-style: normal; for heading elements because they are generally taken care of by browser's default style sheets. But it depends on how much you want to nail down. There is wisdom in doing as little as possible and treading lightly, others have provided for you. These sorts of things can help reduce bloat and make it easier to troubleshoot. -- dorayme |