Linked Image with CSS Hover background Color Jerks in IE8

Please see http://www.rrmuseumpa.org/about/musviews/index.shtml and hover over any of the five slideshow images, using IE8. Note that the hover causes a jerk when the assigned background color for hover kicks in, apparently by adding some vertical margin at botton. It's fine in all other browsers.
What I want is for any image that serves as a link to not have a border and to not pick up the default hover background color, and to not cause the "jerk" in IE8.
CSS file is at http://www.rrmuseumpa.org/css/main.css . Specific css would be most appreciated.
Thanks.
Jim

The very last style rule states
/* HACK FOR IE: to stabilize appearance of menu items; the slash in float is to keep IE 5.0 from parsing */
@media screen, projection
ul.MenuBarHorizontal li.MenuBarItemIE
display: inline;
f\loat: left;
background: #FFF;
color: #FFF;
This is a white backgorund and white text. Simply change the background colour to #2565B2
Gramps

Similar Messages

  • CSS  coloumn background color Issue in IE8

    Hi,
    JDev: 11.1.1.4.
    The following style class is not working in ie8 where as it is working in FireFox.
    <af:column sortProperty="Description" filterable="true"
    headerText="#{bindings.SetupVO1.hints.Description.label}"
    styleClass="#{row.bindings.Date.attributeValue gt row.bindings.sDate.attributeValue? tableRowCreate :''}"
    id="c20" >
    <af:inputText value="#{row.bindings.Description.attributeValue}"
    label="#{bindings.SetupVO1.hints.Description.label}"
    columns="#{bindings.SetupVO1.hints.Description.displayWidth}"
    shortDesc="#{bindings.SetupVO1.hints.Description.tooltip}"
    id="it19" autoSubmit="true">
    </af:inputText>
    </af:column>
    CSS StyleClass:
    .tableRowCreate{
    background-color: #CC9966;
    Thanks,
    Rajesh

    Hi Rajesh ,
    I tried applying this style , It works fine for me in IE8.
    I am using Jdev 11.1.1.3.0
    but this shouldnt be the cause , can u try installing firebug and see the style class getting applied to column

  • CS6 #nav links change hover background color based on its position in series

    First post from a complete DW CS 6 novice on Win7.  Not knowing JavaScript or JQuery, I thought I would add simplest animation to a website navigation based on the two col fixed header footer design. The navigation links on the left <sidebar1> have been increased to 24, with a common link background in the default state.  When the cursor is passed over the links they would change background color to one of five given in the image placed in the jpeg image loaded as the 1st list item.  The image itself only acts as a color key to the five catagories of links directly below it, and is not hyperlinked.  The idea is that someone looking for new tools would need to hover down the nav links and only be concerned with the Yellow background ones, even if they appear in any random position down the list.  To give each link a color to start with would make <sidebar1> appear too colorful.
    I have David Powers' two dvd titles and was thinking of using a nth-of-type() .  It does not work.  Perhaps there are two sets of colons required (  a:hover:nth-of-type(4), a:active:nth-of-type(4) {background-color:#f00;}   ).  There is surely a way that would work but I do not know enough of DW and CSS at present to figure this out.
    Many thanks.

    I don't what menu system you're using, but you might be able to create some CSS classes to use in your menu like so:
    <ul>
    <li>a href="some-link.html" class="about">about link</a></li>
    <li>a href="some-link.html" class="new">new link</a></li>
    <li>a href="some-link.html" class="new_proc">new procedures link</a></li>
    <ul>
    CSS:
    li a.about:hover {background-color:gray}
    li a:new:hover {background-color:forestgreen}
    li a:new_proc:hover {background-color:lawngreen}
    and so on...
    Nancy O.

  • Adobe Camera RAW (All Versions) Import Canon .CR2 / RAW images with an orange / green color cast.

    All versions of Adobe Camera RAW including the latest 7.3 import .CR2 images with a greenish / orange color cast.
    Tested on 7D, and 5D III
    Makes Hardwood floors, and flesh tones look abysmal.
    Canon's Digital Photo Professional renders the colors fine, as does ACDSee 5.0 Pro (when viewing)  Exporting from ACDSee however is another story as things look even worse than Adobe.  DPP can export perfectly.
    Changes to Color Gammut / Space have little or no effect.

    Good day!
    You might want to post on the dedicated Camera Raw Forum.
    http://forums.adobe.com/community/cameraraw
    Also posting some screenshots might help illustrate the issue.
    Regards,
    Pfaffenbichler

  • Linked Image with border on hover

    I have a page of tiled image that link to project pages on the website. My boss found a website that he likes how the images appear when you hover over them with the mouse. I know of a way to do this, but I'm not sure what the best way would be: 1) create a rollover image that has the first image without a border, and the second image with a border... this seems like it would take the longest but give me the look I want because there are 55 little images. I have been trying to figure out how to apply the border for a linked image thru a CSS style, but the only thing it will give me is a border that appears all of the time (not just on hover). I'm wondering if there would be a quicker way to do this. Here is a link to the page that I would like to apply the style to: http://stateline7.com/index_files/Page532.htm , and here is the page that my boss liked the appearance of: http://holmes.zenfolio.com/

    a img { border:1px solid white; }
    a:hover img { border:1px solid green; }
    Assuming your background color is white, this will give you a green border on hover with no change in the image's effective size due to the appearance of the border.

  • Help With Editing The Background Color On PHP-Based Photo Gallery Software!

    I recently installed and began using some PHP-based photo
    gallery software for my website. I've been able to customize other
    areas of the software's appearance (text color, etc), but am unsure
    of what need to be done to change the background on the 'Default'
    skin from white to black. Any suggestions? Below are copies of the
    code from the 'index.php' and the css from the 'default skin'
    portions of the software:
    <title>BigMusicGeek.com -- Your Online Concert
    Photography Authority!</title><?
    include "config.php";
    include GAZ_DIR_FS_ROOT . "includes/init.php";
    include GAZ_DIR_FS_ROOT . "includes/classes/gallery.php";
    $gaz_gallery = new gallery();
    //$gaz_gallery->gazimage = 78;
    echo $gaz_gallery->show();
    ?>
    a.gaz_nav {
    color: #FF0000;
    a:hover.gaz_nav {
    color: #FF0000;
    .gaz_path {
    font-size : 11px;
    font-family : Tahoma, Geneva, Arial, Helvetica, sans-serif;
    .gaz_cat_descr {
    font-size : 12px;
    font-family : Tahoma, Geneva, Arial, Helvetica, sans-serif;
    color: red;
    .gaz_cat_title {
    font-size : 12px;
    font-family : Tahoma, Geneva, Arial, Helvetica, sans-serif;
    color: red;
    font-weight : bold;
    .gaz_comment {
    font-size : 11px;
    font-family : Tahoma, Geneva, Arial, Helvetica, sans-serif;
    color: #FF0000;
    .gaz_nav_thumb {
    border-color:#f0f0f0;
    .gaz_nav_thumb_sel {
    border-color:orange;
    .gaz_image_info {
    font-size : 11px;
    font-family : Tahoma, Geneva, Arial, Helvetica, sans-serif;
    color: #000000;

    BigMusicGeek posted in macromedia.dreamweaver:
    >
    quote:
    Originally posted by:
    Newsgroup User
    > BigMusicGeek posted in macromedia.dreamweaver:
    >
    > > Okay, so I've been able to change the background to
    black (thanks
    > > again, BTW), but I'm still unsure of how to add a
    menu bar to the top
    > > of the gallery's main page. I keep copying and
    pasting in the code,
    > > but can seem to make it work.
    > >
    > > My main gallery page:
    http://www.bigmusicgeek.com/gallery/index.php
    >
    > I see no evidence on that page that you've pasted the
    table containing
    > your menu bar. When you do paste it, just be aware that
    the path to the
    > images and links will be slightly different (the images
    are not in the
    > gallery folder but at the root of your site: "/Home
    Navigation
    > Photos01.png" *)
    >
    > <IMPORTANT>
    > You have your <title> tag before your DOCTYPE.
    Make sure your DOCTYPE
    > is the first line. Then make sure the <title> tag
    is inside the <head>
    > section, not before it.
    > </IMPORTANT>
    >
    > > An example of my menu bar:
    http://www.bigmusicgeek.com/Home.html
    > > (it's at the top of the screen).
    >
    > When I paste the table code from there into the gallery
    page - and
    > changed the paths to match where they are, it appears
    just fine. Note
    > that you'll need to include the JavaScript from the
    gallery page in
    > order for all those JS rollovers to work. Probably need
    that big onLoad
    > section in the <body> tag as well - again,
    adjusting paths to match
    > where the images are.
    >
    > * You will very often see recommendations to avoid
    spaces or unusual
    > characters in your file names. ie: "Home Navigation
    Photos01.png"
    > should probably be "Home_Navigation_Photos01.png" or
    maybe a "-"
    > instead of spaces.
    > Mark
    >
    > Thanks for the input...again! Pardon me for being a
    novice, but what
    > piece(s)
    > of the paths for the menu bar need to be changed?
    If you've set up your site definition properly in
    Dreamweaver, you should
    be able to copy the table in design view from home.html and
    paste into
    gallery/index.php and DW will correct the paths
    automatically. It /might/
    even copy the relavent JavaScript over (I don't have DW on
    this computer to
    test that).
    But to answer your question, any path to the images must
    point to the site
    root (where your images are stored). The links will likely
    need to point
    there as well. For example, the Home button in your table
    gets its image
    from:
    src="Home Navigation Home01.png"
    In order for that to work from pages in the gallery folder,
    it will need to
    be linked with either a site root relative, or a simple
    relative path:
    src="/Home Navigation Home01.png"
    The above example tells the server to look for the image in
    the site's root
    folder.
    src="../Home Navigation Home01.png"
    This example tells the server to get the image from one
    folder up from the
    current folder.
    Likewise for the links. ie: href="Home.html" would become
    either
    href="/Home.html" or href="../Home.html"
    href="phpBB3/index.php" could become href="/phpBB3/index.php"
    or even
    href="/phpBB3/"
    HTH
    Mark A. Boyd
    Keep-On-Learnin' :)

  • Dreamweaver CSS div background color doesn't match .png menu button color on PC

    Hello,
    I created a menu with buttons the same background color (CSS) as the background color on my CSS template. However, for some reason, the colors don't look the same on mac and a pc. The background on the menu buttons that I created (.png) match the css template div background on a mac. But, when the site displays on a pc, the menu background color from the css template is darker than the .png background color, even though the color code is the exact same. On a mac, the .png background color matches the css div template color exactly. Anyone know what is going on or how to fix?
    I appreciate any assistance!

    Are both monitors calibrated?
    http://www.wikihow.com/Calibrate-Your-Monitor
    Windows renders images a tad darker.  To compensate, use Gamma Correction in Photoshop.
    http://www.photoshopsupport.com/tutorials/cb/gamma.html
    Nancy O.
    Alt-Web Design & Publishing
    Web | Graphics | Print | Media  Specialists 
    http://alt-web.com/
    http://twitter.com/altweb

  • Link styles with CSS

    I have a web page with 2 navigations - one horizontal under
    the header and the other located vertically down the left of the
    page.
    The text colour styles of each are different.
    So I wanted to allocate seperate a:link a:visit a:hover
    a:active to both navigations, to do this I have used the following
    css:
    For the horizontal navigation:
    .table2 a:link, a:visited {
    text-decoration:none;
    color:#FFFFFF;
    .table2 a:hover, a:active {
    color: #8da2c4;
    For the second navigation:
    .table3 a:link, a:visited {
    text-decoration:none;
    color: #717578;
    .table3 a:hover{
    color:#333333;
    However when uploaded, instead of the horizontal navigation
    returning to white once visited, it turns grey - the colour of the
    second navigation. The browser (IE) obviously has trouble
    seperating the assigned link styles even though I have tried
    targeting more specifically.
    Does anyone know of a way around this, if there is a way at
    all??!
    Much appreciated

    Pseudo-classes and container styles are what you need - here
    are some
    tutorials.
    http://www.mako4css.com
    http://www.thepattysite.com/linkstyles1.cfm
    http://www.projectseven.com/tutorials/pseudoclasses/index.htm
    Murray --- ICQ 71997575
    Adobe Community Expert
    (If you *MUST* email me, don't LAUGH when you do so!)
    ==================
    http://www.dreamweavermx-templates.com
    - Template Triage!
    http://www.projectseven.com/go
    - DW FAQs, Tutorials & Resources
    http://www.dwfaq.com - DW FAQs,
    Tutorials & Resources
    http://www.macromedia.com/support/search/
    - Macromedia (MM) Technotes
    ==================
    "(_seb_)" <[email protected]> wrote in message
    news:[email protected]...
    > Lou28 wrote:
    >> I have a web page with 2 navigations - one
    horizontal under the header
    >> and the other located vertically down the left of
    the page.
    >> The text colour styles of each are different.
    >> So I wanted to allocate seperate a:link a:visit
    a:hover a:active to both
    >> navigations, to do this I have used the following
    css:
    >>
    >> For the horizontal navigation:
    >>
    >> .table2 a:link, a:visited {
    >> text-decoration:none;
    >> color:#FFFFFF;
    >> }
    >> .table2 a:hover, a:active {
    >> color: #8da2c4;
    >> }
    >>
    >>
    >> For the second navigation:
    >>
    >> .table3 a:link, a:visited {
    >> text-decoration:none;
    >> color: #717578;
    >> }
    >> .table3 a:hover{
    >> color:#333333;
    >>
    >>
    >> However when uploaded, instead of the horizontal
    navigation returning to
    >> white once visited, it turns grey - the colour of
    the second navigation.
    >> The browser (IE) obviously has trouble seperating
    the assigned link
    >> styles even though I have tried targeting more
    specifically.
    >>
    >> Does anyone know of a way around this, if there is a
    way at all??!
    >>
    >> Much appreciated
    >>
    >
    > change:
    > .table2 a:link, a:visited {
    > to:
    > .table2 a:visited, .table2 a:link {
    >
    > and do the same for .table3 links.
    >
    > --
    > seb ( [email protected])
    >
    http://webtrans1.com | high-end web
    design
    > Downloads: Slide Show, Directory Browser, Mailing List

  • Table content hover, background color change

    How can I achieve this background color hover effect? Like the table on this page:
    http://uconn.edu/holiday/teams.html

    jr4292 wrote:
    How can I achieve this background color hover effect? Like the table on this page:
    http://uconn.edu/holiday/teams.html
    If you want all your links to have the same effect then put this code in your style sheet:
    a:hover {
        background:#73D5FC;
        border:1px solid #DDDDDD;
    Good luck.

  • Help: I have a globe image with a black background...how to...

    Hi,
    I have a simple Earth globe image with a black stars background. I'd like to cut out the black background and get this all white....basically id like just the globe visible with no background.
    http://www.ingerreime.no/inger/Images/globe.tiff
    I know this is newbie question, but i have no idea how to do it. Please don't tell me i have to get photoshop???
    Thanx!
    David

    Dave:
    Terence isn't the jerk in this thread. He's was just attempting to give you a solution you can run yourself instead of having it given to you.
    GraphicConverter can create a transparent file, a gif. Try the following workflow:
    1 - first convert the file to a gif (use 89a) and save and reopen.
    2 -select the Magic Pen and set it's sensitivity to about 40 (double click on it will bring up the setting pane).
    3 - click on the black background to select all of the black.
    4 - select to the Edit->Make Selection Transparent menu option.
    5 - save the file.
    The black will turn to a checkerboard pattern indicating transparency. If you anticipate a lot of advance editing I suggest you look at Photoshop Elements. I find it much more powerful than GC and it supports layers which is a very powerful too. Here's an example of some of the advanced editing you can do with it.
    Do you Twango?
    TIP: For insurance against the iPhoto database corruption that many users have experienced I recommend making a backup copy of the Library6.iPhoto database file and keep it current. If problems crop up where iPhoto suddenly can't see any photos or thinks there are no photos in the library, replacing the working Library6.iPhoto file with the backup will often get the library back. By keeping it current I mean backup after each import and/or any serious editing or work on books, slideshows, calendars, cards, etc. That insures that if a problem pops up and you do need to replace the database file, you'll retain all those efforts. It doesn't take long to make the backup and it's good insurance.
    I've written an Automator workflow application (requires Tiger), iPhoto dB File Backup, that will copy the selected Library6.iPhoto file from your iPhoto Library folder to the Pictures folder, replacing any previous version of it. You can download it at Toad's Cellar. Be sure to read the Read Me pdf file.

  • Positioning images with css

    Hello everybody,
    thanx in advance for your help.
    Needless 2 say that my question would sound stupid to most of
    you, but if it sounded smart I would probably be the one to answer
    it and not to make it... It sounds logic, doesn't it?...I apologize
    for my reflection and I go straight to the point:
    PRESUPPOSAL:
    I created a pretty complex web-page design with Photoshop.
    It's not just about a logo in the 0% 0% position and some colored
    bar on the viewport border but a 800X600 image with lots of
    particulars.
    ISSUE:
    I'd like 2 put it on the html page with CSS.
    QUESTIONS:
    a)Shall I put the image as a whole?
    b)Or shall I sLice it as I'd do if I wanted to use a table to
    position it?
    If the a) is the correct option, won't the page be to heavy
    in terms of kbytes? (As far as I know a sliced image is overally
    lighter than an entire one)
    If the b) is the correct option, how can I position more than
    one picture with css in a html document? (I studied css from a
    short Molly Holzshlag's book and she only explains how to position
    1 single image)
    c)Is it ok to use CSS image-positioning to such an extreme
    extent? Should I prefer table-positioning considering my 800X600px
    goal? I mean, is there any technical problem I ignore? Is it a
    inapropriate use of CSS?
    Thank you so very much and enjoy the week!
    bye,
    Giuseppe, Rome

    Let's start by seeing your page, please.
    > I created a pretty complex web-page design with
    Photoshop. It's not just
    > about
    > a logo in the 0% 0% position and some colored bar on the
    viewport border
    > but a
    > 800X600 image with lots of particulars.
    I'm already worried. This sounds massively heavy....
    Murray --- ICQ 71997575
    Adobe Community Expert
    (If you *MUST* email me, don't LAUGH when you do so!)
    ==================
    http://www.dreamweavermx-templates.com
    - Template Triage!
    http://www.projectseven.com/go
    - DW FAQs, Tutorials & Resources
    http://www.dwfaq.com - DW FAQs,
    Tutorials & Resources
    http://www.macromedia.com/support/search/
    - Macromedia (MM) Technotes
    ==================
    "giuseppe craparotta" <[email protected]>
    wrote in message
    news:[email protected]...
    > Hello everybody,
    > thanx in advance for your help.
    > Needless 2 say that my question would sound stupid to
    most of you, but if
    > it
    > sounded smart I would probably be the one to answer it
    and not to make
    > it... It
    > sounds logic, doesn't it?...I apologize for my
    reflection and I go
    > straight to
    > the point:
    >
    > PRESUPPOSAL:
    > I created a pretty complex web-page design with
    Photoshop. It's not just
    > about
    > a logo in the 0% 0% position and some colored bar on the
    viewport border
    > but a
    > 800X600 image with lots of particulars.
    > ISSUE:
    > I'd like 2 put it on the html page with CSS.
    > QUESTIONS:
    > a)Shall I put the image as a whole?
    > b)Or shall I sLice it as I'd do if I wanted to use a
    table to position it?
    > If the a) is the correct option, won't the page be to
    heavy in terms of
    > kbytes? (As far as I know a sliced image is overally
    lighter than an
    > entire one)
    > If the b) is the correct option, how can I position more
    than one picture
    > with
    > css in a html document? (I studied css from a short
    Molly Holzshlag's book
    > and
    > she only explains how to position 1 single image)
    > c)Is it ok to use CSS image-positioning to such an
    extreme extent? Should
    > I
    > prefer table-positioning considering my 800X600px goal?
    I mean, is there
    > any
    > technical problem I ignore? Is it a inapropriate use of
    CSS?
    >
    > Thank you so very much and enjoy the week!
    > bye,
    > Giuseppe, Rome
    >

  • Problem with cfdocument and background colors with table borders

    i am having a great deal of difficulty with cfdocument
    rendering my tables with cells that have background colors. the
    background colors seem to bleed through the table border. a picture
    at 100% magnification can be seen at
    http://www.vitad.com/cfdoc.jpg
    and at 1600% magnification at:
    http://www.vitad.com/cfdoc2.jpg.
    i am attaching sample code of the what generated the pdf in the
    pictures. btw, i am running cfmx 7 with hot fix 2.

    Hi fresher4flex,
    Since you are using the item Renderer for the DataGrid Column try to apply the styles dynamically to the background of your itemRenderer by making using of the rollOver and rollOut events.
    Thanks,
    Bhasker

  • Exporting linked images with overlays

    Hi,
    I'm using InDesign CS5.5 on OS X Lion.
    I have linked images in my InDesign document that I want to export as JPG and maintain the original file naming scheme. That part is easy (export as HTML, look in the images folder; export as ePUB, look in the images folder of the archive; etc.). But what I'm struggling with is when there are overlays added in InDesign. Some examples of overlays: part labels (e.g., "a", "b", "c"), text labels, arrows, lines, etc. The only way I've found to export the overlays is to do this:
    -Group the placed image and overlay items together
    -Apply Object Export Options to the grouped item such that Custom Rasterization is checked
    -Export via one of the options (e.g., HTML, ePUB)
    I get one image per group, which is what I want. The problem is that the filename for that image is now a random number. What I really need is the filename for the original image to be used.
    I've also tried exporting to other formats, e.g., PDF (and using the extract all image options) but that doesn't preserve the overlays in the extracted images (which makes sense since the PDF sees the letters as text).
    I figure to do this I have to write a script. So before I embark on that quest, I was hoping to get opinions on whether a) such a script is possible and b) whether there is a better way. For specific workflow considerations, moving the adding of these overlays to the images outside of InDesign (e.g., via Photoshop) is not an option.
    I envision a script that does the following:
    -Set custom rasterization on every grouped object
    -Export all grouped objects and other linked images as JPG (with certain settings)
    -The exported images for the links would preserve the original filename (adding "_fmt" like InDD does now would be okay) and for the grouped items it would use the filename of the linked image that is part of the group (and fallback to a random number if there is no such image). In the case that the filename could not be specified, then embed the original filename of the linked image in the group
    Obviously, if a script could also do the grouping of objects (e.g., finding a linked image, checking to see if there is anything on top of it, grouping it all together), then that would be even better, but I'm not holding my breath. :-)
    Thanks,
    Steve

    This is where the Adobe DNG could shine.
    http://www.adobe.com/products/dng/index.html
    Worth the read ... this can save the changes that one
    makes.
    DNG does NOT help in this case.
    There is a huge misunderstanding that this is part of what DNG can or should do.
    But if you think about it, what good are the adjustments being stored in DNG if you have to use a particular program to open it anyway?
    Think about Aperture's Edge Sharpen for a second. Lets say you store that value in a DNG. Fine, what other program is going to able to reproduce that result EXACTLY to how you were previewing it at 100% on your monitor?
    Lighroom is trying to do something along these lines by passing editing commands off to Bridge through DNG. But here you run into another problem - it constrains what editing any one program can do. If Lightroom is limited to only ever having editing commands that are the same as what Bridge offers, and no other program on earth supports them, then what have you really accomplished? Will unknown editing commands simply be dropped without warning?
    That's why I think simply exporting projects, which hold master images alongside sidecar files (very like XMP) that describe edits are about as good as you are going to get. If you want to truly preserve editing work and you care about quality, nothing beats a TIFF file where 100% of the pixels are exactly as you reviewed them during editing. I personally trust Aperture enough to back up master images along with edits, and am fine with that.

  • InDesign PDF transparent images not printing right background color.

    problem with exporting an InDesign Document to a PDF and printing. My transparent images are showing up with a darker background than what they are placed on. Know how to help?

    Thanks everyone!  That really helped.
    There were a few other things that I had to make sure of also.
    Solution:
    Images placed in InDesign that were made in Photoshop or another program should be in ckmy format.  The background needs to be in the same ckmy.   Transparency blend must be set at CKMY, then Transparency Flattener presents must be set at Rasters/Vectors: 0 Line art and text resolution: 600, Gradient and mesh resoltuion 300.  Exporting to PDF must be done under present PDF/X-4:2008 Compatibility: Acbrobat 7.

  • Applets foregrouded with html body background color

    In our application we are using applets while loading applets ,applets controls are foregrounded with html background color thats why we are unable see applets properly.
    please give us suugesion, how can we solve this problem.
    thanks in advance..

    The HTML editor is the 'FCK Editor' of old, and the config for it is stored on the server where all of the javascript for your server instance is stored. You can modify much of the configuration of the HTML editor. The documentation for modifying the configuration of FCKEditor is here:
    http://docs.fckeditor.net/FCKeditor_2.x/Developers_Guide/Configuration/Configuration_File

Maybe you are looking for