Results 1 to 4 of 4

Thread: DHTML Window widget - can't get rid of border

  1. #1
    Join Date
    Sep 2007
    Posts
    13
    Thanks
    4
    Thanked 0 Times in 0 Posts

    Default DHTML Window widget - can't get rid of border

    1) Script Title: DHTML Window widget (v1.1)

    2) Script URL (on DD): http://www.dynamicdrive.com/dynamici...ndow/index.htm

    3) Describe problem: I wasn't getting the close and minimise buttons showing on my window in Firefox. I've increased the padding in the .drag-handle part of the dhtmlwindow.css and the buttons show in Firebox.

    But, arg, now there's a grey border on the top and left hand side of the box which I can't get rid of (showing in both IE and Firefox, but looking pretty ugly in IE).

    I know that the answer is probably super easy, but I can't see the wood for the trees... my css is below, could anyone tell me what to do to remove that grey border on the top and left please? I'd be super grateful!

    Code:
    .dhtmlwindow{
    position: absolute;
    border-style: solid;
    border-color: #F6F6F6;
    border-width: 17px;
    visibility: hidden;
    background-color: #000000;
    padding: 0px;
    margin: 0px;
    }
    
    .drag-handle{ /*CSS for Drag Handle*/
    z-index: 1;
    padding: 8px;
    text-indent: 3px;
    font: bold 12px Arial;
    background-color: #000000;
    border-style: solid;
    border-color: #000000;
    border-width: 0px;
    color: #000000;
    cursor: move;
    overflow: hidden;
    width: auto;
    margin: 0px;
    filter:progid:DXImageTransform.Microsoft.alpha(opacity=100);
    -moz-opacity: 1;
    opacity: 1;
    }
    
    .drag-handle .drag-controls{ /*CSS for controls (min, close etc) within Drag Handle*/
    position: absolute;
    right: 1px;
    top: 1px;
    cursor: hand;
    cursor: pointer;
    padding: 0px;
    margin: 0px;
    }
    
    * html .drag-handle{ /*IE6 and below CSS hack. Width must be set to 100% in order for opaque title bar to render*/
    width: 100%;
    }
    
    
    .drag-contentarea{ /*CSS for Content Display Area div*/
    border-top: 0px solid black;
    background-color: #000000;
    color: black;
    height: 150px;
    padding: 0px;
    border: 0px;
    overflow: auto;
    margin: 0px;
    }
    
    .drag-statusarea{ /*CSS for Status Bar div (includes resizearea)*/
    border-top: 0px solid black;
    background-color: #000000;
    padding: 0px;
    margin: 0px;
    height: 13px; /*height of resize image*/
    }
    
    
    .drag-resizearea{ /*CSS for Resize Area itself*/
    float: right;
    width: 13px; /*width of resize image*/
    height: 13px; /*height of resize image*/
    cursor: nw-resize;
    padding: 0px;
    margin: 0px;
    font-size: 0;
    }

  2. #2
    Join Date
    Mar 2005
    Location
    SE PA USA
    Posts
    30,495
    Thanks
    82
    Thanked 3,449 Times in 3,410 Posts
    Blog Entries
    12

    Default

    Please post a link to the page on your site that contains the problematic code so we can check it out.
    - John
    ________________________

    Show Additional Thanks: International Rescue Committee - Donate or: The Ocean Conservancy - Donate or: PayPal - Donate

  3. #3
    Join Date
    Sep 2007
    Posts
    13
    Thanks
    4
    Thanked 0 Times in 0 Posts

    Default

    Sorry, there's an example of the problem here - http://www.frontlinecostello.com/video/video.html Please just click play video (not the video I'm going to use - that's not available yet, but just an idea).

    Many many thanks )

  4. #4
    Join Date
    Mar 2005
    Location
    SE PA USA
    Posts
    30,495
    Thanks
    82
    Thanked 3,449 Times in 3,410 Posts
    Blog Entries
    12

    Default

    I believe that the border you are seeing is the generic iframe border. In the dhtmlwindow.js file you will find this line:

    Code:
    t.contentarea.innerHTML='<iframe src="" style="margin:0; padding:0; width:100%; height: 100%" name="_iframe-'+t.id+'"></iframe>'
    add (red):

    Code:
    t.contentarea.innerHTML='<iframe src="" frameborder="0" style="margin:0; padding:0; width:100%; height: 100%" name="_iframe-'+t.id+'"></iframe>'
    - John
    ________________________

    Show Additional Thanks: International Rescue Committee - Donate or: The Ocean Conservancy - Donate or: PayPal - Donate

  5. The Following User Says Thank You to jscheuer1 For This Useful Post:

    georgie_b (02-22-2008)

Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •