Div section positioned using css absolute

Greetings All,<br />
<br /><br />
I have one irpt paged containing two applets and an alert box (a div section styled as   which places it off the screen until needed.
<br /><br />
The second applet (which I set to 1px x 1px) refreshes every few seconds kicking off a js function to decide if the alert box should be seen by the user. 
<br /><br />
This has worked well for me in the past.  (I have done this using the second applet and some image (png) that I update behind the scenes.  The problem now is I added a viewable applet to display information, and my alert box ends up under the applet. 
<br />
I have tryed adjusting both the applet and the alert box zindex to bring the alert box on top.  I have tryed to set focus on the alert box(div with an ID.) I found a similar post here about setting the focus twice.  Still no luck. 
<br /><br />
Any other suggestions would be most welcome...
<br /><br />
Thanks
<br /><br />
Dennis

Found this solution to the problem.  and to give credit where credit is due...
[/code]<a href="http://secretlabs.thesafebox.com/DivOverApplet/">secretlabs  Div Over Applet</a>
Tried to post the code but wasn't allowed Probably because there was java in it...

Similar Messages

  • Dreamweaver Functions using CSS

    I'm just learning about CSS, as I'm developing a site and I
    have two questions.
    I created a simple form with a text box and submit button,
    both of which are positioned using CSS. The red form indicator box
    is shown way at the top of the page where it sits in the code. This
    is the only way I can get the tag to "wrap" both div tags. Will
    this cause any problems?
    Also, my header and footer contain a good amount of div tags
    for CSS positioning. What do I need to do to save all the items in
    each together as a library item? Is this possible? How do I select
    all the various elements?
    Thanks,
    Brad

    > Also, my header and footer contain a good amount of div
    tags for CSS
    > positioning.
    Not good. Sounds like a potentially case of "divitis".
    Publish the page and
    post a link to it here so we can dissect your code.
    >>The red form indicator box is
    The What? is Where?
    Walt
    "goodears" <[email protected]> wrote in
    message
    news:etkhtn$6g3$[email protected]..
    > I'm just learning about CSS, as I'm developing a site
    and I have two
    > questions.
    >
    > I created a simple form with a text box and submit
    button, both of which
    > are
    > positioned using CSS. The red form indicator box is
    shown way at the top
    > of
    > the page where it sits in the code. This is the only way
    I can get the
    > tag to
    > "wrap" both div tags. Will this cause any problems?
    >
    > Also, my header and footer contain a good amount of div
    tags for CSS
    > positioning. What do I need to do to save all the items
    in each together
    > as a
    > library item? Is this possible? How do I select all the
    various
    > elements?
    >
    > Thanks,
    >
    > Brad
    >

  • DW doesn't display the div section with CSS. Why?

    I was thinking to switch to DW to compose my HTML/CSS pages (I am still using MS Front Page), but when I loaded my HTML page the major <div> section isn't displayed in the Design pane, although it is displayed with the Live view on.
    Here's the HTML of the block that is missing:
    function(){return A.apply(null,[this].concat($A(arguments)))}
    <div id="text_body">
    <h1>Description</h1>
    Blah-blah-blah
    </div>
    and CSS file:
    function(){return A.apply(null,[this].concat($A(arguments)))}
    #text_body
        position: absolute;
        margin-top: -10px;
        padding: 20px;
        width: auto;

    Murray, let me reiterate myself. The page in question opens without a problem in a web browser, the issue arises when I
    open it in DW for editing, thus posting it somewhere online will look OK to you.
    To reproduce what I see, download the zip I posted above and unzip it somewhere on your hard drive (there are only two files in it: html and css). Then open the sample02.htm in DW for editing. After that open it in a web browser of your liking right off your hard drive and you'll see what I'm talking about.
    PS. I might be doing something wrong with the DW, since, as I said, I've been using it roughly for a couple of hours. If so, I'd appreciate if someone could point me to what exactly I'm not doing right?

  • Using CSS and Javascript to display a div with flash in it, mozilla reloads the flash file!

    I am using CSS and Javascript to display a div with an
    embedded flash object in it. Mozilla Firefox reloads the flash file
    when the div is displayed! (I dont want this to happen, as it's
    unexpected functionality, my expectation would be that the flash
    file would not change it's state at all, and would remain in
    whatever state it was left in.)
    I was wondering if anyone has come across this issue and is
    there something I can do to prevent this from occurring?
    To be more specific, I have a single HTML page with 8 flash
    files embedded in it (yeah I know, it's a bit much). I am then
    using CSS and Javascript to display (via a numbered link (with an
    id)) an equivalent numbered div tag containing the flash file.
    Mozilla Firefox reloads the flash object that is in the div.
    Internet Explorer will not do this and will instead, load the flash
    object only upon initial view of the flash object. All subsequent
    links (in IE) will NOT reload the flash object on the page. I'm
    guessing this is some kind of difference in the flash player as an
    Active X object and the plugin, or is it just IE being clever? Or
    am I way off?
    Anyway, here is the code...

    I am using CSS and Javascript to display a div with an
    embedded flash object in it. Mozilla Firefox reloads the flash file
    when the div is displayed! (I dont want this to happen, as it's
    unexpected functionality, my expectation would be that the flash
    file would not change it's state at all, and would remain in
    whatever state it was left in.)
    I was wondering if anyone has come across this issue and is
    there something I can do to prevent this from occurring?
    To be more specific, I have a single HTML page with 8 flash
    files embedded in it (yeah I know, it's a bit much). I am then
    using CSS and Javascript to display (via a numbered link (with an
    id)) an equivalent numbered div tag containing the flash file.
    Mozilla Firefox reloads the flash object that is in the div.
    Internet Explorer will not do this and will instead, load the flash
    object only upon initial view of the flash object. All subsequent
    links (in IE) will NOT reload the flash object on the page. I'm
    guessing this is some kind of difference in the flash player as an
    Active X object and the plugin, or is it just IE being clever? Or
    am I way off?
    Anyway, here is the code...

  • Photoshop sliced layout output are table base,  do it can control the position by CSS with div?

    Dear all,
    I have make some image in Photoshop, and sliced it to html
    page, but open it in dreamweaver it show me the table layout that
    Photoshop Sliced maked ..
    I am wonder, now many web site are integration with CSS, and
    I had saw some total using CSS with div maked Web Site, how to
    control the sliced image after that Photoshop sliced it?
    Any simple example for newbie reference?
    And sorry of my poor English.

    It seems you have exported the html from photoshop into
    Dreamweaver.
    This is not the best way to build a page. You should slice up
    your images
    and then export the images only into a folder. You then build
    the page
    using these exported images in your table or css layout. You
    can place the
    images directly into table cells or divs or use them as
    background images
    via css.
    Good CSS tutorials can be found here:
    http://www.adobe.com/devnet/dreamweaver/css.html
    Nadia
    Adobe� Community Expert : Dreamweaver
    http://www.DreamweaverResources.com
    - CSS Templates|Tutorials
    http://www.csstemplates.com.au
    http://www.adobe.com/devnet/dreamweaver/css.html
    CSS Tutorials for Dreamweaver
    > Dear all,
    >
    > I have make some image in Photoshop, and sliced it to
    html page, but open
    > it
    > in dreamweaver it show me the table layout that
    Photoshop Sliced maked ..
    >
    > I am wonder, now many web site are integration with CSS,
    and I had saw
    > some
    > total using CSS with div maked Web Site, how to control
    the sliced image
    > after
    > that Photoshop sliced it?
    >
    > Any simple example for newbie reference?
    >
    > And sorry of my poor English.
    >

  • Linking flash buttons to website using div sections

    Ok, I am a total Newbie at Flash and Dreamweaver and I am
    having serious issues linking flash the flash buttons from my
    navigation bar to the main frame on my webpage. I have the buttons
    working, and they do link to a page, just they do not link to the
    frame, instead they load the page as a full page itself.
    I am using Dreamweaver and a website template I found online.
    I believe the problem to why it is not working is because this
    template doesn't seem to be using frames, and I can not find the
    name of the frame to reference in the flash button actions. This
    template is using a lot of <div> tags to separate the
    sections in the index file.
    Does anyone out there know how to link flash button actions
    to open a page in a specific div section? Also, how can I make sure
    that it is these div tags that are creating the frames, and how to
    find out what each section is called? (I'm new to dreamweaver as
    well)
    This is my first post and last resort, forums don't fail me
    now! Thanks to anyone out there who helps me.
    Darian

    use a javascript function to change the div content and the
    flash externalinterface class to call the javascript
    function.

  • How to overlap an image using css in my .cfm

    Hi, I know this is a little off-topic, but in my gallery.cfm,
    I have a couple of rows that have an image in it, I was wondering
    how I can use css to put some text over the image? Like for
    example, how can I put some red text "Sold out" over toy1.jpg? I
    have tried using z-index but that requires some positioning but in
    this case there is no positions ? Can someone please help me on
    this?
    Sample code:
    <table align="center">
    <tr>
    <td>
    <img src="images/toy1.jpg" width="128" height="180"
    border="0">
    </td>
    </tr>
    <tr>
    <td>
    <img src="images/toy1.jpg" width="128" height="180"
    border="0">
    </td>
    Thank you,
    C

    Hope this helps.
    <style type="text/css">
    .cell {position:relative;}
    .productImage {top:0px; left:0px; width:128px; height:180px;}
    .soldText {position:absolute; top:30px; left:0px;
    font-size:2.0em; color:red; width:100%;
    text-align:center;
    font-family:impact,lucida console,verdana;
    opacity:.8}
    </style>
    <table align="center" border="2">
    <tr>
    <td>
    <div class="cell">
    <div class="productImage"><img src="images/toy1.jpg"
    width="128" height="180" border="0"></div>
    <div class="soldText">Sold!</div>
    </div>
    </td>
    </tr>
    <tr>
    <td><div class="cell">
    <div class="productImage"><img src="images/toy1.jpg"
    width="128" height="180" border="0"></div>
    <div class="soldText">Sold!</div>
    </div>
    </td>
    </tr>
    </table>

  • Viewing layers - using css

    Hi
    I have just started to use css. When I publish the html page
    which uses the css everything looks great but when I try and view
    the page in deign view I can only see 1 layer - the footer. The
    "prevent overlap box" in the layer panel is not checked and all
    layers are "Visable" and all have the "Eye icon" next to them. I
    have a horrible feeling that I'm being thick!!. I'm using
    dreamweaver MX V6. Can someone PLEASE tell me what I need to do,
    learning css is hard enough and I'm afraid my brain is going to
    explode if I can't sort this out.
    Thanks to anyone taking the time to read this
    Welsh Babe
    If it's any help you can see the page by going to
    http://www.kingsandqueenswales.com/layout.html

    >It can get very confusing for people just staring out.
    Oh boy, ain't dat de troof!
    Jo
    "Osgood" <[email protected]> wrote in
    message
    news:[email protected]...
    > Welsh Babe wrote:
    >
    >> Hi
    >> I have just started to use css. When I publish the
    html page which uses
    >> the css everything looks great but when I try and
    view the page in deign
    >> view I can only see 1 layer - the footer. The
    "prevent overlap box" in
    >> the layer panel is not checked and all layers are
    "Visable" and all have
    >> the "Eye icon" next to them. I have a horrible
    feeling that I'm being
    >> thick!!. I'm using dreamweaver MX V6. Can someone
    PLEASE tell me what I
    >> need to do, learning css is hard enough and I'm
    afraid my brain is going
    >> to explode if I can't sort this out. Thanks to
    anyone taking the time to
    >> read this
    >> Welsh Babe
    >> If it's any help you can see the page by going to
    >>
    http://www.kingsandqueenswales.com/layout.html
    >>
    >
    > I can see all of your layers in v7 of DW design view.
    >
    > However I'm afraid I have bad news. You are not going
    about using css to
    > position your elements in the correct way.
    >
    > Laying out a page using layers, which are absolutely
    positioned, is only
    > going to get you deeper and deeper into trouble.
    >
    > If you are wanting to leap from a table design to an all
    css design then
    > the learning curve is going to be steep and has little,
    or nothing to do
    > with using layers.
    >
    > A good all css design uses <div> containers not
    layers. Although they
    > appear to be the same they are not. It can get very
    confusing for people
    > just staring out.
    >
    > A layer is an absolutely positioned container to which
    you give a top and
    > a left position. IT WILL NOT MOVE FROM THIS POSITION.
    This is usually not
    > desirable. Test out your current construction by using
    the zoom text tool
    > available in most modern browsers. See how quickly the
    page breaks down as
    > the layers being to overlap one another.
    >
    > A <div> container is mearly a box into which you
    load content. You can
    > then give it a position on the page by using margin or
    you can float
    > <divs> to put them side by side.
    >
    > If you know how to use tables then I would strongly
    recomend you stay with
    > them until you know how to position correctly using css.
    You can still use
    > css to style tables, there is nothing wrong with using
    simple tables.
    >
    > If you want to study how to use css correctly for
    positioning take some
    > time out and read through a couple of tutorials:
    >
    >
    >
    http://www.projectseven.com/tutorials/css/qdmacfly/index.htm
    >
    >
    > Tutorial 8 and 9 here
    >
    >
    http://css.maxdesign.com.au/floatutorial/
    >
    >
    >
    >
    >
    >

  • Using css but having these browser issues

    Hello
    Wondered if you might have any fix for the following...I've
    tried several forums and a couple of css people but no one seems to
    have an answer other than bugs in the browser. But surely there is
    a way...
    If you go to
    http://www.enhancedwireless.net/Company/TEST.shtml
    and rollover the first "(ODMA)" you should get a gif css pop up
    which works great in FF, IE6/7 and Netscape (PC and MAC). But in
    Safari (any version) and latest Opera (PC and MAC) the pop up is
    fragmented and won't go away, breaks up. Would love a suggestion on
    a fix...
    And I have a swf file css pop up which again works great in
    FF and Netscape, even Safari, but not in IE 6 where the pop up
    won't go away (and even multiplies when you scroll) and IE 7 where
    a strange white "flash" appears over the entire page each time you
    mouseover the "(71 countries)".
    Just rollover "(71 countries)" -
    http://www.enhancedwireless.net/Technology/patentPortfolio.shtml
    So my two questions are:
    1.) how to fix the image css pop up for Safari and Opera
    2.) how to fix the swf css pop up for IE 6/7
    I know I could adapt a javascript code out there but was
    hoping to do this with simplicity using css - any way?
    Thanks very much for your time
    KB

    I think you have just chosen a hinky way to implement that
    CSS 'rollover'.
    And you have so much unecessary/redundant CSS in your rules,
    it's a little
    difficult to sort out what's happening.
    Take a look at this page -
    http://66.165.80.209/page2test.php
    where I have
    done something similar, and see if you can understand what's
    going on.
    The menu links contain an absolutely positioned <span>
    containing a
    transparent GIF image. The background image of that span is
    the door. The
    CSS rollover produces the swap. Positoining your rollover
    image on the page
    you linked should work when applied in the same way, don't
    you think?
    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
    ==================
    "iwics2" <[email protected]> wrote in
    message
    news:[email protected]...
    > Hello
    >
    > Wondered if you might have any fix for the
    following...I've tried several
    > forums and a couple of css people but no one seems to
    have an answer other
    > than
    > bugs in the browser. But surely there is a way...
    >
    > If you go to
    http://www.enhancedwireless.net/Company/TEST.shtml
    and
    > rollover
    > the first "(ODMA)" you should get a gif css pop up which
    works great in
    > FF,
    > IE6/7 and Netscape (PC and MAC). But in Safari (any
    version) and latest
    > Opera
    > (PC and MAC) the pop up is fragmented and won't go away,
    breaks up. Would
    > love
    > a suggestion on a fix...
    >
    > And I have a swf file css pop up which again works great
    in FF and
    > Netscape,
    > even Safari, but not in IE 6 where the pop up won't go
    away (and even
    > multiplies when you scroll) and IE 7 where a strange
    white "flash" appears
    > over
    > the entire page each time you mouseover the "(71
    countries)".
    >
    > Just rollover "(71 countries)" -
    >
    >
    http://www.enhancedwireless.net/Technology/patentPortfolio.shtml
    >
    > So my two questions are:
    >
    > 1.) how to fix the image css pop up for Safari and Opera
    > 2.) how to fix the swf css pop up for IE 6/7
    >
    > I know I could adapt a javascript code out there but was
    hoping to do this
    > with simplicity using css - any way?
    >
    > Thanks very much for your time
    >
    > KB
    >

  • Insert chinese font using css?

    How do insert default chinese font into my website using css, and what are the web-safe chinese font available?
    let say I have my dafault english font set like this
    body{
              font-family:Arial, Helvetica, sans-serif;
    where do I add in the chinese font?
    I try doing like this
    body{
         font-family:Arial, "黑体" ,Helvetica, sans-serif;
    But it doesnt seem to be working...

    It is because you did not specify the charset=utf-8
    try inserting this line between the head section:
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    and I also notice you did not declare your doctypes properly, which you will also include this line(if youare using transition):
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    so overall your code will be like this:
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>About</title>
    <link href="css/styles.css" rel="stylesheet" type="text/css" media="screen" />
    </head>
    <body>
    <div id="outer">
        <div id="wrapper">
            <div id="banner">
            <h1 id="chi1">首頁</h1>
            <h1 id="eng1">Welcome</h1>
            </div>
            <div id="topnav">
                <ul id="left">
                <li><a href="home.html">HOME</a></li>
                <li><a href="about.html">ABOUT</a></li>
                   <li><a href="events.html">EVENTS</a></li>
                   <li><a href="pictures.html">PICTURES</a></li>
                    <li><a href="media.html">MEDIA</a></li>
                <li><a href="contact.html">CONTACT</a></li>
                </ul>
                  <ul id="right">
                 <li><a href="home.html">首頁</a></li>
                <li><a href="about.html">有關</a></li>
                <li><a href="events.html">事件</a></li>
                   <li><a href="pictures.html">照片</a></li>
                <li><a href="media.html">媒體</a></li>
                <li><a href="contact.html">連絡</a></li>
                </ul>
            </div>

  • Problem regarding the creation of Table using CSS.

    Hi ,
    Here I have a Problem regarding the creation of Table using CSS.
    In My Application i have a table with multiple rows(Rows are Dynamically added to the table).First i am setting the table with the following properties:
    width:900px;
    height : auto,
    Overflow : visible,
    Max-height: : 200px.
    If I use above properties,I'm getting a table with 5 or 6 rows(height upto 200px).After that i am getting the Vertical ScrollBar.
    The problem is when a table has many columns, Vertical and Horizontal Scrolls are coming at the time of setting the table. The table height is not Increasing dynamically.
    How can i use "height" property in CSS? (I want the table height to be increased when the columns are more.)
    Thanks & Regards
    Madhavi

    Hey humble user. Errr I'm trying to understand what ur trying to do. U want to create a section of a region destructively from an existing region right? If so select the option convert to new region (opt-comm-R or selecting it by right clicking). Check your audio bin to make sure. Whats the "merge" function? Are u refering to the glue tool?

  • Displaying linked pages in an area of the screen, using CSS?

    Imagine that I have a column on the left of the page that has a list of links to other pages.  When you click on any of those links, then to the right the linked page is shown.
    I know how to do this with frames, but I'm trying to figure this one out using CSS.
    Can anyone point me in the right direction?
    Below is a code sample that if your save and then view in a browser will show you (hopefully) what I am trying to achieve.
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
    <!--
    This html code creates a document with a:
        header that resizes to fit the width of the browser;
            sidebar on the left (of fixed width);
            'text' area, to the right of the sidebar, which resizes to fit the browser window width
            foot, which resizes to fit the browser window width.
    -->
    <title>Test site</title>
    <style type="text/css">
    <!--
    body {
    text-align: justify;
    min-width:700px;
    color:#000; <!-- text color for the whole document -->
    div.header {
    height:4em;
    width:auto;
    border:0;
    padding:0;
    text-align:center;
    background-color:#6CF;
    div.sidebar {
    width: 15em;
    float:left;
    text-align: left;
    border-bottom:0px;
    padding-top: 1em;
    padding-right: 1em;
    padding-bottom: 1em;
    padding-left: 0em;
        background-color:#390
    div.footer {
    width:auto;
    border:0;
    padding:0;
    text-align:center;
    background-color:#6CF
    -->
    </style>
    </head>
    <body>
    <div class="header">
       header goes here
    </div>
    <div class="sidebar">
    <!--   Siderbar goes here, and will have links to other pages.
       change width (in div.sidebar, to change width). -->
       Link to page 1<br />
       Link to page 2<br />
       Link to page 3<br />
       etc...<br />
    </div>
    <!-- <br clear="left" /> stops the footer overlapping the sidebar. -->
    This is the area  where the pages linked to should be displayed.<br />
    So, if you click on the "Link to page 1" link, to the left, the contents of page 1 will be shown here.<br />
    If you click on the link to the left that says "Link to page 2" then the contents of page 2 will be shown here, etc.<br clear="left" />
    <div class="footer">
    footer goes here
    </div>
    </body>
    </html>

    Thank you Nancy!  Your solution is (I believe) 99% of the way to being exactly what I want.
    The code fragment below:
    <div class="sidebar">
    <!--   Siderbar goes here, and will have links to other pages.
       change width (in div.sidebar, to change width). -->
       <a href="../Test/About.html" target="Frame1"> About</a><p>
       <a href="../Test/FAQ.html" target="Frame1"> FAQ</a><p>
       <a href="../Test/Contact.html" target="Frame1"> Contact us</a><p>
    </div>
    <iframe name="Frame1" id="Frame1" src="../Test/About.html" height="auto" width="auto" allowtransparency="true"  border="0" margin="0" scrolling="auto"  > </iframe>
    but I want the window that contains the 'imported' code to expand to be the same height as the sidebar and wide enough to stretch to the rightmost side of the visible screen.
    I was guessing that
    height="auto" width="auto"
    would have done the trick, but it would seem not. Any ideas?

  • How to style a GridPane Colomn or row using CSS ?

    Hi,
    I would like to style a Grid pane column using CSS. I found possible styling the entire GridPane using " -fx-border-color:yellow; -fx-border-insets:5; -fx-border-width:3;" for example. But is there a way of styling a single row or a single column?
    For example, let's say I want a yellow border on my last column, does anyone has a clue ?
    Thanks.
    Seb

    CSS doesn't do such things.
    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
    ==================
    "celebritymusic" <[email protected]> wrote
    in message
    news:esm5vt$8mn$[email protected]..
    > Hi
    >
    > I want to make an image in a DIV morph into another (in
    the same DIV). I
    > was wondering if there is a simple CSS way of doing
    this, rather than
    > making an animated gif?
    >
    > Cheers
    >
    > Shaun

  • Centering Images using CSS but having links on the Images

    Hi all,
    I have a problem on centering an image using CSS. I read on many forums that you have to use margin-left , margin-right and set to auto. and also set the display:block which I had done.
    The problem is if I want to have a link from the image. Because I have set the display to block, the link will span the entire container containing it! How do I resolve that? I only want the image to be linkable and not the entire container!
    Thanks for reading!

    Murray *ACP* wrote:
    Because I have set the display to block, the link will span the entire container containing it!
    That's incorrect.  If the display:block is applied to only the IMAGE, the anchor tag will be exactly the same dimensions as the image and will not fill the container.
    Hi Murray,
    Weirdly it does in my experiments. (code below). Even if I set the 'a' tag to the width of the image it still makes the whole <div> container clickable:
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
    <title>Untitled Document</title>
    <style type="text/css">
    #imgWrapper {
        width: 900px;
        margin: 0 auto;
        border: 1px solid #000;
    #imgWrapper img {
        margin: 0 auto;
        display: block;
    </style>
    </head>
    <body>
    <div id="imgWrapper">
    <a href="http://www.bbc.co.uk"><img src="slice_2.jpg" width="595" height="130" /></a></div>
    </body>
    </html>

  • Display problem using CSS

    I am sort of new to CSS and have a id/style with div tags
    that display perfectly in IE7; however in FireFox it is messed up.
    Here is the link
    http://www.themarcuscorp.com/Pages/about_us.shtml
    For the main navigation menu I am using PVII and I made the
    menu a SSI. I inserted the SSI into a <div> but also use a
    background to achieve the shading effects in the div.
    Can anyone tell what the issue is?
    Thanks
    Dave Manley

    oh, and also missing <head></head> - I think you
    need to create a New File,
    check what's missing and add it to your page.
    Jo
    "josie1one" <joleros[nospam]@yahoo.com> wrote in
    message
    news:epj3s5$hm8$[email protected]..
    > You have no DOCTYPE, rendering the page in quirks mode
    > for example, this is missing:
    >
    > <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0
    Transitional//EN"
    > "
    http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    > <html xmlns="
    http://www.w3.org/1999/xhtml">
    >
    > at the head of your document.
    > Actually, your page looked the same in IE6 and FF2.
    > Hope this helps
    >
    > --
    > Jo
    >
    >
    >
    >
    > "dkmanley" <[email protected]> wrote in
    message
    > news:epijhm$d$[email protected]..
    >>I am sort of new to CSS and have a id/style with div
    tags that display
    >> perfectly in IE7; however in FireFox it is messed
    up. Here is the link
    >>
    http://www.themarcuscorp.com/Pages/about_us.shtml
    >> For the main navigation menu I am using PVII and I
    made the menu a SSI. I
    >> inserted the SSI into a <div> but also use a
    background to achieve the
    >> shading
    >> effects in the div.
    >> Can anyone tell what the issue is?
    >> Thanks
    >> Dave Manley
    >>
    >
    >

Maybe you are looking for

  • [SOLVED]USB flash drive no longer showing up in /dev

    My USB flash drives are no longer showing up in /dev. I also don't see them in /dev/disks/... either. Dmesg outputs: [731969.826862] usb 1-1: new high-speed USB device number 5 using ehci_hcd Any ideas on where to start? Last edited by nadman10 (2012

  • When i open shared Document folder getting "An unexpected error has occurred. " error

    Hi, I am getting "An unexpected error has occurred. " error when i open Shared Document folder in Internet URL. But if i open the foder in newtab i can view the documents with out error also intranet URL also doesnt have any problem. I am using Share

  • Clarify These doubts Plz

    1.Why we are using XI in the file to IDOC scenario?without XI we'll do this data transfer from third party system to SAP r/3 system by using EDI.so wht is the neccesity to use of XI? 2.How we can recognise the third party system in XI?don't say abt t

  • Iphoto to mail

    Have Mac OS X 10.5.3, Installed ILife 08, when I chose picture to transfer to mail the option of size to send always comes out small regardless of option picked ie actual size. Any suggestions?

  • To create a Java Calendar

    Hi, I have a doubt about how can I do to implement a Calendar with Java. I searched on Internet but I didn't find related information. Someone can help me please? I want to know if exists manuals, tutorials, etc, to do that task. I wait for an answer