32 users online (0 members and 32 guests)  

Thread: IFrame troubles


  Results 1 to 4 of 4

Related

  1. more imagemap and iframe troubles    Forum: HTML Forum
    Replies: 2
  2. Traffic Troubles    Forum: Website Promotion Forum
    Replies: 0
  3. Firefox CSS troubles    Forum: CSS Forum
    Replies: 6
  1. #1
    mathsrob's Avatar
    New User

    Status
    Offline
    Join Date
    Jul 2011
    Posts
    1

    IFrame troubles

    I'm haveing a certain amount of trouble getting an iframe to behave the way I want it to. I have a horizontal navigation bar atop my webpage, which has hover events that make the tabs height increase and decrease. But on the mouseover it shifts the iframe when it moves and I don't know how to stop it doing this. Here is the code.

    The menu bar:
    Code:
    <div class="inner" id="menu">
          
            <ul class="list" id="menulist">
            
              <li class="menuitem" id="menu-home">
              Home</li>
              
              <li class="menuitem" id="menu-portfolio">
              Portfolio</li>
              
              <li class="menuitem" id="menu-information">
              Information</li>
              
              <li class="menuitem" id="menu-blog">
              Blog</li>
              
              <li class="menuitem" id="menu-contact">
              Contact</li>
              
            </ul>
            
          </div>
    Its CSS:
    Code:
    /*-------------------|
    |----|MENU LAYER|----|
    |--------------------|
    |150px Width         |
    |Left-Aligned        |
    |-------------------*/
    
    #menu {
    	width:750px;
    	height:42px;
    	padding:0;
    	margin:0;
    	margin-left:auto;
    	margin-right:auto;
    	clear:both;
    }
    
    .list {
    	margin:0;
    	padding:0;
    	list-style:none;
    }
    
    .list li {
    	background:rgba(0, 170, 255, 1);
    	float:left;
    	display:block;
    	margin:0;
    	padding:0;
    	padding-top:5px;
    	width:150px;
    	height:37px;
    	text-align:center;
    	cursor:pointer;
    	-moz-transition:1s;
    	-o-transition:1s;
    	-webkit-transition:1s;
    }
    
    .list li:hover {
    	background:rgba(0, 100, 255, 1);
    	padding-top:10px;
    	padding-bottom:10px;
    	height:42px;
    }
    
    .list li .menuitem {
    	margin:0;
    	padding:0;
    	display:block;
    	background:black;
    	text-align:center;
    }
    
    #menu-home {
    	border-top-left-radius:25px;
    }
    
    #menu-contact {
    	border-top-right-radius:25px;
    }
    What CSS should I apply to the iframe to stop it moving when the menu tabs resize?

    Thanks in advance.

    Maths Rob

  2. #2
    jthayne's Avatar

    Status
    Offline
    Join Date
    Aug 2008
    Location
    Texas
    Posts
    508

    Re: IFrame troubles

    I am not sure I understand. Is the menu bar the iframe? If not, we need more information as to how the menu bar and iframe are related. Mostly, I am just not clear on what exactly is moving and when.

  3. #3
    mytony's Avatar
    New User

    Status
    Offline
    Join Date
    Sep 2011
    Posts
    1

    Re: IFrame troubles

    I have the similar problem.Any suggestions.

  4. #4
    jonssmith's Avatar
    Disabled

    Status
    Offline
    Join Date
    Feb 2012
    Posts
    2

    Re: IFrame troubles

    i m not understanding your problem of iframe.
    i can solve it .
    Last edited by HTML; 02-13-2012 at 06:11 AM.



Tags for this Thread