Is this in an iFrame? Have you inspected the element with developer tools to see what styles are being applied to it? Maybe yours are simply not specific enough.
Here is an example using your original that shows the margin works just fine: https://jsfiddle.net/wnzfh6c4/ On Fri, Mar 25, 2016 at 9:29 PM Karl DeSaulniers <k...@designdrumm.com> wrote: > 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=%2308799f > "></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/
