HTML Frameset: Getting Rid of the Crosshairs

**CiberTHuG** · Jun 11th, 2002, 09:33 AM

Given the following two documents:

Code:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN"
  "http://www.w3.org/TR/html4/frameset.dtd">
<html>
  <head>
    <title>Frame Test</title>
  </head>
  <frameset rows="50%, 50%" cols="50%, 50%">
    <frame name="frmTopLeft" frameborder="0" noresize scrolling="no" marginwidth="0px" marginheight="0px"
     src="black.html">
    <frame name="frmTopRight" frameborder="0" noresize scrolling="no" marginwidth="0px" marginheight="0px"
     src="black.html">
    <frame name="frmBottomLeft" frameborder="0" noresize scrolling="no" marginwidth="0px" marginheight="0px"
     src="black.html">
    <frame name="frmBottomRight" frameborder="0" noresize scrolling="no" marginwidth="0px" marginheight="0px"
     src="black.html">
  </frameset>
</html>

Code:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
  "http://www.w3.org/TR/html4/strict.dtd">
<html>
  <head>
    <title>Black Body</title>
    <style type="text/css">
      body {
        background: black;
        margin: 0px;
      }
    </style>
  </head>
  <body>
  </body>
</html>

How do I get rid of the big white crosshairs?

**cpradio** · Jun 11th, 2002, 10:22 AM

Try putting:

Code:

    <style type="text/css">
      body {
        background: black;
        margin: 0px;
      }
    </style>

in the <head> tags on your frameset page

**CiberTHuG** · Jun 11th, 2002, 10:36 AM

No affect for me. But then again, there is no body in a frameset document. I also played with border-width on the frameset and the frames. Nothing. Even border-width on the body of the frame source page did nothing.

What I am actually trying to do is line up peices of a picture in different frames. The text over the left side of the image is a title and is static on the page, while the text over the right side of the image is the body of the page and is scrollable if needed. But there is a big space down the middle of the "image" (between the two images).

Another problem I have... I can't use em or ex when setting the frameset. Not a huge problem, but annoying.

**CiberTHuG** · Jun 11th, 2002, 10:56 AM

I've found a way to do what I want (for the most part) without using a frame.

Now I'm just trying to solve this because it is annoying me.

scoutt · Jun 11th, 2002, 01:19 PM

**cpradio** · Jun 11th, 2002, 01:20 PM

Originally posted by scoutt
<frameset rows="50%, 50%" cols="50%, 50%" border="0">

in frames isnt it frameborder="0" and he has that.

scoutt · Jun 11th, 2002, 01:21 PM

not for the frame itself. the frameborder is for the frame document, in this case black.html. that is the way I understand it.

**Rick Bull** · Jun 11th, 2002, 01:22 PM

You need to add:

Code:

border="0"

to the frameset tag. It's a proprietry attribute, but most browsers are buggy with their implementation of the border attribute, but most are fine with with the border attribute. If you want no borders you'll have to have an "unvalidating" document I'm afraid, at least to my knowledge.

**cpradio** · Jun 11th, 2002, 01:23 PM

oh... cool! it works!

-Matt

**CiberTHuG** · Jun 11th, 2002, 03:01 PM

Well, that is annoying. Fortunately I've found a way around it. I don't have to use frames at all to get the affect I wanted. Which is good. I simply won't use a feature that is not part of the standard. I have enough of a problem with IE ignoring half the standard, I don't need to mess with proprietary extentions.

Here is my solution. I don't expect it to work in IE, but it should be using nothing but standards.

Code:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
  "http://www.w3.org/TR/html4/strict.dtd">
<html>
  <head>
    <title>Test</title>
    <style type="text/css">
      body {
        background: black url("orbicon.jpg") no-repeat fixed center center;
        color: white;
      }
      div#textTitle {
        position: fixed;
        top: 50%;
        left: 20%;
      }
      div#textContent {
        position: absolute;
        width: 70%;
        top: 0px;
        left: 30%;
      }
    </style>
  </head>
  <body>
    <div id="textTitle">Title</div>
    <div id="textContent">This is some flavor text that is on this page.</div>
  </body>
</html>

You'll have to put enough text in the content block to see the scrolling affect. The background image and the title text should not scroll.

scoutt · Jun 11th, 2002, 03:16 PM

nope, IE makes the whole page scroll. isn't the overflow: auto part of the standard? also what browser does this work in if IE doesn't do it right?

**CiberTHuG** · Jun 11th, 2002, 03:47 PM

Yes, the default value for overflow is auto, but there shouldn't be anything that is overflowing. What IE is not supporting is the fixed positioning for the textTitle div and the background image. Mozilla gets this correct. I think Netscape and Opera will do this page correctly aswell.

I learned about the fixed positioning at the css/edge web site. I particularly like the distored complex spiral. I think that is a very very nice affect.

**Rick Bull** · Jun 11th, 2002, 05:08 PM

Hey CiberTHuG, you said you don't want to use propritary extensions, and I may be totally wrong here

, but aren't marginwidth and marginheight MS only extensions? Also just in case you or anyone else doesn't know there is a work around for the fixed positioning thing in IE:

Code:

#menu {
  position:absolute;
}
/*IE doesn't understand html>body, but opera and ns/moz do*/
html>body #menu {
  position:fixed;
}
#menu {
  left:0px;
  top:0px;
  /*ETC ETC*/
}

**CiberTHuG** · Jun 18th, 2002, 08:56 AM

Marginheight and 'width are part of the frameset specs. I expected them to be deprecated, but they aren't labeled as such.

**Rick Bull** · Jun 18th, 2002, 09:59 AM

Yeah you're right, what is the IE only one then? I'm sure it has one something like that.

Thread: HTML Frameset: Getting Rid of the Crosshairs

Thread Tools

Display

HTML Frameset: Getting Rid of the Crosshairs

Posting Permissions