The below fixed both "back to..." buttons when I set it. I was using Safari. Did not test other browsers at this time though.
Best, Karl DeSaulniers Design Drumm http://designdrumm.com On Mar 28, 2016, at 2:01 PM, Karl DeSaulniers <k...@designdrumm.com> wrote: > .twEDFooter td a { } > > add > > display: inline-block; > > Best, > > Karl DeSaulniers > Design Drumm > http://designdrumm.com > > > > > On Mar 28, 2016, at 11:15 AM, Angela French <afre...@sbctc.edu> wrote: > >> http://www.dev.sbctc.edu/calendar.aspx. Click on any link under the Event >> column to display the event details. It is here that you will see a "BACK TO >> PREVIOUS VIEW" link directly underneath the month navigation bar. This is >> the item I am trying to put space above and below to make it stand out a >> little more. >> >> Angela French >> >> -----Original Message----- >> From: css-d-boun...@lists.css-discuss.org >> [mailto:css-d-boun...@lists.css-discuss.org] On Behalf Of Karl DeSaulniers >> Sent: Friday, March 25, 2016 6:30 PM >> To: CSS-D >> Subject: Re: [css-d] syntax: attribute selector on linked image >> >> Link? >> >> Best, >> Karl >> >> Sent from losPhone >> >>> On Mar 25, 2016, at 5:52 PM, Angela French <afre...@sbctc.edu> wrote: >>> >>> Have tried all 3 suggestions (plus a few of my own) and none work. There >>> must be some other factor at play here. I think I will talk to support at >>> Trumba. >>> /* Classes to override styles in Trumba calendar */ a[title="Back to >>> Previous View"] img{ >>> display:block; >>> margin-top:20px; >>> outline: 3px solid red; >>> } >>> >>> span.ImageLink a{ >>> border:3px solid black; >>> margin-left:50px!important; >>> } >>> >>> .twEDFooter { >>> margin-bottom:20px; >>> } >>> >>> -----Original Message----- >>> From: Philippe Wittenbergh [mailto:e...@l-c-n.com] >>> Sent: Thursday, March 24, 2016 5:48 PM >>> To: CSS-D >>> Cc: Angela French >>> Subject: Re: [css-d] syntax: attribute selector on linked image >>> >>> >>>> On Mar 25, 2016, at 01:56, Angela French <afre...@sbctc.edu> wrote: >>>> >>>> I am trying to write CSS that will apply top margin on an image that is >>>> used as a back arrow button. The generated html is as follows: >>>> <td> >>>> <span> >>>> <a title="Back to Previous View" >>>> href="javascript:controller.navigateBack();"> >>>> <img width="11" height="13" alt="Back to Previous View" title="Back >>>> to Previous View" >>>> src="http://www.trumba.com/i/DgC4zgBAwusa93o2xKoNIHtu.gif?color=%2308 >>>> 799f"></a></span></td> >>>> >>>> I tried writing the CSS as: >>>> >>>> a[title="Back to Previous View"] img{ >>>> display:block; >>>> margin-top:20px; >>>> background-color:pink; /*test*/ >>>> } >>>> >>>> Unfortunately, I'm seeing no effect. Is my syntax incorrect, or am I >>>> trying to do something that is not possible? >>> >>> Your syntax is correct (given the HTML markup you quoted). If you see no >>> effect: >>> >>> 1/ is your image transparent? otherwise you won’t see the >>> background-color.The `outline` property is your friend for debugging >>> purposes. >>> >>> img { outline: 3px solid red; } /* or lime or cyan or fuchsia - any of >>> those highly visible colours are very useful */ >>> >>> 2/ your image, although set to `display:block`, is nested inside inline >>> elements, inside a `td`. The margin may have no visible effect due to that >>> – depending on how the other elements are styled. >>> >>> 3/ anything in the stylesheet that could possibly override your styling? >>> check with the developer tools in your browser what styling is actually >>> applied. >>> >>> >>>> I also tried targeting the <td> the image is in and applying padding to >>>> the cell like this: >>>> >>>> td < a[title="Back to Previous View"] img{ >>> >>> there is no such thing a '<' selector. >>> >>> Philippe >>> -- >>> Philippe Wittenbergh >>> http://l-c-n.com/ >>> >>> >>> >>> >>> >>> ______________________________________________________________________ >>> css-discuss [css-d@lists.css-discuss.org] >>> http://www.css-discuss.org/mailman/listinfo/css-d >>> List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- >>> http://css-discuss.org/policies.html >>> Supported by evolt.org -- http://www.evolt.org/help_support_evolt/ >> ______________________________________________________________________ >> css-discuss [css-d@lists.css-discuss.org] >> http://www.css-discuss.org/mailman/listinfo/css-d >> List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- >> http://css-discuss.org/policies.html >> Supported by evolt.org -- http://www.evolt.org/help_support_evolt/ > > ______________________________________________________________________ > css-discuss [css-d@lists.css-discuss.org] > http://www.css-discuss.org/mailman/listinfo/css-d > List wiki/FAQ -- http://css-discuss.incutio.com/ > List policies -- http://css-discuss.org/policies.html > Supported by evolt.org -- http://www.evolt.org/help_support_evolt/ ______________________________________________________________________ css-discuss [css-d@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
