Container within Container question

Discussion in 'Web Design' started by r.lionel, Jan 2, 2015.

to remove all ads.
  1. r.lionel

    r.lionel New Member

    Messages:
    1
    I'm a try'er, I try real hard over long periods of time only improving very little. I decided to ask for help. I'm trying to put multiple containers within my footer. (I'm probably wrong for doing that!) I cannot get multiple items inside my footer. They just stack underneath, I've tried all the shifting and floating, can't get it. Plz help, thank you.
    HTML:
    <!doctype html>
    <html>
    <head>
    <meta charset="utf-8">
    <!-- TemplateBeginEditable name="doctitle" -->
    <title>Texarkana Photo Booth: Professional Photo Booth Rental</title>
    <!-- TemplateEndEditable -->
    <title>Texarkana Photo Booth</title>
    
    <meta name="description" content="Texarkana Photobooth specializes in renting photobooths for your special occasion. Our mission is to capture great memories for our customers. We also take pride in creating an exciting and fun atmosphere for your guests. We provide a unique twist on your traditional photos and party themes." />
    
    
    <meta name="keywords" content="Photobooth,photo booth,longview Photobooth,texarkana Photo Booth,photobooth rental,photobooth rentals shreveport,rent a photo booth,longview Photobooth Rental,texarkana Photo Booth Rental,photo booth rental,Photobooth rental boston,texarkana Photobooths,texarkana photo booths" />
    
    
    <link href="../Styles/newStyle.css" rel="stylesheet" type="text/css">
    <style type="text/css">
    a:link {
    	color: rgba(216,15,10,1);
    }
    a:visited {
    	color: rgba(18,0,134,1);
    	float: left;
    }
    body {
    	margin: 0px;
    	padding: 0px;
    }
    </style>
    <script type="text/javascript">
    function MM_swapImgRestore() { //v3.0
      var i,x,a=document.MM_sr; for(i=0;a&&i<a.length&&(x=a[i])&&x.oSrc;i++) x.src=x.oSrc;
    }
    function MM_preloadImages() { //v3.0
      var d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array();
        var i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0; i<a.length; i++)
        if (a[i].indexOf("#")!=0){ d.MM_p[j]=new Image; d.MM_p[j++].src=a[i];}}
    }
    
    function MM_findObj(n, d) { //v4.01
      var p,i,x;  if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) {
        d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);}
      if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n];
      for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].document);
      if(!x && d.getElementById) x=d.getElementById(n); return x;
    }
    
    function MM_swapImage() { //v3.0
      var i,j=0,x,a=MM_swapImage.arguments; document.MM_sr=new Array; for(i=0;i<(a.length-2);i+=3)
       if ((x=MM_findObj(a[i]))!=null){document.MM_sr[j++]=x; if(!x.oSrc) x.oSrc=x.src; x.src=a[i+2];}
    }
    </script>
    <!-- TemplateBeginEditable name="head" -->
    <!-- TemplateEndEditable -->
    <!--The following script tag downloads a font from the Adobe Edge Web Fonts server for use within the web page. We recommend that you do not modify it.--><script>var __adobewebfontsappname__="dreamweaver"</script><script src="http://use.edgefonts.net/cousine:n4:default;courier-prime:n4:default;bigshot-one:n4:default;anonymous-pro:n4:default;arimo:n4:default;acme:n4:default;alegreya:n4:default.js" type="text/javascript"></script>
    </head>
    
    
    
    
    <body onLoad="MM_preloadImages('../images/booth_on.jpg','../images/rates_on.jpg','../images/contact_on.jpg','../images/header_02.jpg')">
      
      
    <div id="socialBar">
      <div class="phoneBox"><span style="font-size: 36px; font-style: normal;">Need a DJ?</span> <strong> www.texarkanadj.com</strong> or call me at <strong>(903)748-4016</strong></div>
      
      
      
      
      <div class="socialButtons"> <img src="../images/twitterIcon.png" width="33" height="30" alt=""/><img src="../images/facebookIcon.png" width="30" height="30" alt=""/><img src="../images/googleIcon.png" width="31" height="30" alt=""/><a href="mailto:[email protected]"><img src="../images/Mail-icon.png" alt="" width="30" height="31" border="0"/></a> </div>
    
    
    
    
    
    
    </div>  
    
    
    
      
    
    <div id="insideContainer">
    <header id="header"><img src="../images/header_01.jpg" alt="" width="1000" height="185" />
    </header>
    <div id="navBar">
      
      <a href="../index.html" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('Image6','','../images/header_02.jpg',1)"><img src="../images/Home_off.jpg" alt="" width="197" height="50" id="Image6" align="middle"></a><a href="../booth.html" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('Booth Button','','../images/booth_on.jpg',1)"><img src="../images/header_04.jpg" alt="Booth Information" width="252" height="50" id="Booth Button" align="middle"></a><a href="../rates.html" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('Image9','','../images/rates_on.jpg',1)"><img src="../images/header_03.jpg" alt="" width="238" height="50" id="Image9" align="middle"></a><a href="../contact.html" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('Contact Us Button','','../images/contact_on.jpg',1)"><img src="../images/header_05.jpg" alt="Contact Us" width="273" height="50" id="Contact Us Button" align="middle"></a>
     
      </div>
      
      <section class="mainBody"><!-- TemplateBeginEditable name="EditRegion1" -->
        
        
        
      <p>Texarkana Photo Booth has set a new standard in Northeast Texas in Photo Booth Entertainment. We are known for giving your event an elegant addition that will no doubt impress all your guests. I have never had a complaint from someone who exited my booth and I guarantee smiles all around! We supply you with props, privacy, and a photo opportunity that is extremely fun and gives you a memento to remember the special occasion. </p>
      <p>hlsjdfklskfj;sf;afjsl;fk</p>
      <p>dfhsldjfhskldfj</p>
      <!-- TemplateEndEditable -->
      </section> 
      <!--mainBody-->
      
      
       
    </div>
    
      <footer id="footerContainer">
        
        <div id="footerBox_center">© 2015 Texarkana Photo Booth. All Rights Reserved.</div>
        <div id="footerBox_right"> gh </div>
       <element>Cheese Please </element>
        
    
    </footer>
    </body>
    </html>
     
    Last edited by a moderator: Jan 3, 2015
  2. chrishirst

    chrishirst Well-Known Member Staff Member

    Messages:
    2,611
    That will be because they are block level elements .

    If you want them alongside each other you HAVE to give them a set width and float them, or set them to display as inline elements.


    And please PLEASE, Dream Weaver auto-generated gibberish code is bad enough to read when IN bbcode [html .... .... [/html delimiters, it is pretty much impossible without them.
     

Share This Page