Solved

div tag problem with iframe

Posted on 2014-04-09
6
310 Views
Last Modified: 2014-04-09
Could someone, please, explain how I should do it in the embedded file below to get div id="meny" to appear visibly on top of the div="sala" or better on top of the iframe. Have tried z-index, but doesn't work. How should I do it?

avky-sl.php
0
Comment
Question by:lericson
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
  • 2
  • 2
  • 2
6 Comments
 
LVL 53

Expert Comment

by:Scott Fell, EE MVE
ID: 39989298
Please render your code and let's see the html.  Better yet, just provide a link to your test page.
0
 

Author Comment

by:lericson
ID: 39989310
0
 

Author Comment

by:lericson
ID: 39989517
The browser I've tested with so far that could render the iframe correctly, at least dislay it, is MS IE 11.
0
Independent Software Vendors: We Want Your Opinion

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

 
LVL 22

Assisted Solution

by:Kim Walker
Kim Walker earned 100 total points
ID: 39989602
No offense, but there are so many errors here I don't know where to begin. Let's start with some basic HTML about lists. There are three types of lists: unordered <ul>, ordered <ol>, and description <dl>. With unordered and ordered lists, the only element that can be inserted as the first generation of child elements is the list item <li> tag. You cannot insert a div <div> tag between the <ul> and <li> tags. You can, however, insert a div tag inside a list item. So, this is acceptable:
<ul>
	<li>
		<div>...</div>
	</li>
	<li>
		<div>...</div>
	</li>
	<li>
		<div>...</div>
	</li>
</ul>

Open in new window

This is not:
<ul>
	<div>
		<li>...</li>
		<li>...</li>
		<li>...</li>
	</div>
</ul>

Open in new window

Next, CSS positioning is for those rare situations where you want to place an element in a particular spot on the page other than its natural location. If you try to absolutely position every element, you need to start with a bottle full of pain reliever because you're going to have one massive headache from frustration.

HTML is designed and intended to flow into the browser window like helium balloons into an inverted box. The first element goes to the top left corner, the next element goes directly beneath it and all that follows will go directly beneath the element that precedes it. It's OK to have boxes of more balloons that float in below the element that precedes it. If you will let that happen, you'll find things much easier.

When you want elements to line up side by side, use float. Avoid using position if at all possible.

You have an extra </div> at the end of line 185 that's pushing the "sala" div below the "behallare" div. If you remove that and all the positioning styles, you will be a lot closer to your desired result.

And finally, use the W3C HTML Validator to expose your errors so you can correct them. Browsers are very forgiving but often times their forgiveness is rendered differently from one browser to the other.
0
 
LVL 22

Expert Comment

by:Kim Walker
ID: 39989619
One more thing: the larger z-index goes on top of the smaller z-index. So a negative z-index will go under a zero z-index or an element without a z-index.
0
 
LVL 53

Accepted Solution

by:
Scott Fell,  EE MVE earned 400 total points
ID: 39989641
yea, I was just playing with your code and it needs to be cleaned up before you start getting into z-index.

However, the pdf did not render in the iframe on chrome.  I found this method worked for both html and xhtml  http://jsbin.com/tefibuya/1/edit
  <iframe src="http://docs.google.com/gview?url=http://skaj.se/medlemmar/lokstall/avky_sl.pdf&embedded=true" style="width:935px; height:1300px;" frameborder="0"></iframe>

Open in new window

0

Featured Post

[Webinar] Code, Load, and Grow

Managing multiple websites, servers, applications, and security on a daily basis? Join us for a webinar on May 25th to learn how to simplify administration and management of virtual hosts for IT admins, create a secure environment, and deploy code more effectively and frequently.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Suggested Solutions

Title # Comments Views Activity
Text too large in Chrome 17 83
center text in div with CSS3 2 31
Check for Numeric Phone Field 14 48
CSS Selector Chain NOT working for this situation? 3 16
Have you tried to learn about Unicode, UTF-8, and multibyte text encoding and all the articles are just too "academic" or too technical? This article aims to make the whole topic easy for just about anyone to understand.
The article shows the basic steps of integrating an HTML theme template into an ASP.NET MVC project
The viewer will receive an overview of the basics of CSS showing inline styles. In the head tags set up your style tags: (CODE) Reference the nav tag and set your properties.: (CODE) Set the reference for the UL element and styles for it to ensu…
The viewer will learn the basics of jQuery including how to code hide show and toggles. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery…

752 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question