2 replies [Last post]
w2tq
w2tq's picture
Offline
newbie
Last seen: 16 weeks 5 days ago
Timezone: GMT-4
Joined: 2020-07-05
Posts: 2
Points: 3

I am familiar with the concept of inheritance but cannot determine how to fix my CSS. Because I'm using an iframe tag, it appears that unless I set the desired height attribute for head, body, div (the one marked with ID #content), and iframe to 98% (or any other desired number), the presentation collapses. Each tag seems to requires the height attribute. (This is my first use of the iframe tag.)

When I tried to introduce another div for the two anchors - nested within the #wrapper div and at the same rank as #content, it too inherited the 98% height attribute. All of my attempts to specifically target the #content div failed. The current code seems to work only if the height attribute is assigned to div (i.e., all divs).

Here is my code:

HTML:
 
<!DOCTYPE html>
<html lang="en"> 
<head>
    <title>Title</title>
    <meta charset="utf-8"/>
    <link href="/style-ebook.css" media="screen" rel="stylesheet" type="text/css" />
    /*     etc. */
    </head>
<body>
    <div id="wrapper">
        <div id="content">
            <p><a href="/sub/ch01.shtml">Top</a></p>
            <p><a href="/00-ToC.shtml">Table of Contents</a></p>
            <iframe src="/html/ch01.html"></iframe>
            </div>
		</div>
    </body>
</html>
 
* * *
 
CSS:
 
html {
    overflow: auto;
}
#wrapper {
	width: 100%;
	max-width:40.0em;
	margin:0 auto;
}
html, body, div, iframe  {
    height: 98%;
}
iframe {
    display: block;
    width: 100%;
    border: none;
    overflow-y: auto;
    overflow-x: hidden;
}

w2tq
w2tq's picture
Offline
newbie
Last seen: 16 weeks 5 days ago
Timezone: GMT-4
Joined: 2020-07-05
Posts: 2
Points: 3

I recognize that I could drop

I recognize that I could drop the #wrapper div, move the #wrapper css to the body, and then encompass the anchor elements in a separate div, but I prefer to retain the wrapper structure and learn what is needed to separately target the nav and content divs (or otherwise prevent the iframe from collapsing).

arslan
arslan's picture
Offline
newbie
pakistan
Last seen: 4 weeks 3 days ago
pakistan
Timezone: GMT+5
Joined: 2019-08-14
Posts: 2
Points: 6

Answer

Is it good for my website this is my website please tell me.