Member Avatar for livefortech

i need help in HTML and CSS....
i want text in left side of slide and forum on rite side of slide.....
when i made a forum on rite side.
slide just down :( i attach css and html file
plz help

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<!--=====================Dynamic Glass===========================-->
<!--==============Designed By : Mian Shahzad Raza================-->
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Dynamic Glass | Home Page</title>
<link rel="stylesheet" type="text/css" href="css/styles2.css"/>
<script src="Scripts/swfobject_modified.js" type="text/javascript"></script>
</head>

<body>
<!---<div id="aj">
<p>Factory 11</p>
<p1>35-37 Canterbury Rd</br></p1>
Braeside Vic 3195
</div>
<div style="float:left; color:#FFF; margin-top:110px; font-weight:400">
<li>Glass splashbacks
</li>
<li>Glass Balustrading
</li>
<li>Pool fences
</li>
<li>Mirrors
</li>
<li>Showerscreens

</li>
<li>Commercial Glazing

</li>
</div>


<!--=========== Head Section Starts =========
<div id="contact-form" class="clearfix">  
    <h1>Get In Touch!</h1>  
    <ul id="errors" class="">  
        <li id="info">There were some problems with your form submission:</li>  
    </ul>  
    <p id="success">Thanks for your message! We will get back to you ASAP!</p>  
    <form method="post" action="process.php">  
        <label for="name">Name: <span class="required">*</span></label>  
        <input type="text" id="name" name="name" value="" placeholder="John Doe" required="required" autofocus="autofocus" />  
  
        <label for="email">Email Address: <span class="required">*</span></label>  
        <input type="email" id="email" name="email" value="" placeholder="johndoe@example.com" required="required" />  
  
        <label for="telephone">Telephone: </label>  
        <input type="tel" id="telephone" name="telephone" value="" />  
  
        <label for="enquiry">Enquiry: </label>  
        <select id="enquiry" name="enquiry">  
            <option value="general">General</option>  
            <option value="sales">Sales</option>  
            <option value="support">Support</option>  
        </select>  
  
        <label for="message">Message: <span class="required">*</span></label>  
        <textarea id="message" name="message" placeholder="Your message must be greater than 20 charcters" required="required" data-minlength="20"></textarea>  
  
        <span id="loading"></span>  
        <input type="submit" value="Holla!" id="submit-button" />  
        <p id="req-field-desc"><span class="required">*</span> indicates a required field</p>  
    </form>  
</div>
</div>
<!--=========== Head Section Starts ================-->
<div class="wrraper">

<div class="header">

	<div id="logo">
    
    	<div id="logoimg">
        <img src="images/logo.png" width="300" height="100" alt="Logo" /></div>
   <div id="menu" align="center">
    	<ul>
        	<li><a href="index.html" id="active">Home</a></li>
            <li><a href="gallery.html">Gallery</a></li>
            <li><a href="commercial-glazing.html">Commercial Glazing</a></li>
            <li><a href="online-qoute.html">Online Quote</a></li>
            <li><a href="color-pallate.php">Color Pallette</a></li>
            <li><a href="contactus.html">Contact Us</a></li>
        </ul>
    </div>
    </div>
    

</div>
<!--============= Head Section Ends ================-->

<!--=========== Body Section Starts ================-->
<div style="float:left; color:#FFF; margin-top:110px; font-weight:400; margin-left:5px">
<li>Glass splashbacks
</li>
<li>Glass Balustrading
</li>
<li>Pool fences
</li>
<li>Mirrors
</li>
<li>Showerscreens

</li>
<li>Commercial Glazing

</li>
</div>
 <div style="margin-left:890px;margin-top:50px; min-height:360px">

<div id="contact-form" class="clearfix">  
    <ul id="errors" class="">  
        <li id="info">There were some problems with your form submission:</li>  
    </ul>  
    <p id="success">Thanks for your message! We will get back to you ASAP!</p>  
    <form method="post" action="process.php">  
        <label for="name">Name: <span class="required">*</span></label>  
        <input type="text" id="name" name="name" value="" placeholder="John Doe" required="required" autofocus="autofocus" />  
  
        <label for="email">Email Address: <span class="required">*</span></label>  
        <input type="email" id="email" name="email" value="" placeholder="johndoe@example.com" required="required" />  
  
        <label for="telephone">Telephone: </label>  
        <input type="tel" id="telephone" name="telephone" value="" /> 
  
        <label for="message">Message: <span class="required">*</span></label>  
        <textarea id="message" name="message" placeholder="Your message must be greater than 20 charcters" required="required" data-minlength="20"></textarea>
        <span id="loading"></span>  
        <input type="submit" value="Holla!" id="submit-button" />   
    </form>  
    </div>
    </div>
<div class="content">

  <object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" width="680" height="360" id="FlashID" titl
  e="Home page Banner">
    <param name="movie" value="media/home.swf" />
    <param name="quality" value="high" />
    <param name="wmode" value="opaque" />
    <param name="swfversion" value="8.0.35.0" />
    <!-- This param tag prompts users with Flash Player 6.0 r65 and higher to download the latest version of Flash Player. Delete it if you dont want users to see the prompt. -->
    <param name="expressinstall" value="Scripts/expressInstall.swf" />
    <!-- Next object tag is for non-IE browsers. So hide it from IE using IECC. -->
    <!--[if !IE]>-->
    <object type="application/x-shockwave-flash" data="media/home.swf" width="680" height="360">
      <!--<![endif]-->
      <param name="quality" value="high" />
      <param name="wmode" value="opaque" />
      <param name="swfversion" value="8.0.35.0" />
      <param name="expressinstall" value="Scripts/expressInstall.swf" />
      <!-- The browser displays the following alternative content for users with Flash Player 6.0 and older. -->
      <div>
        <h4>Content on this page requires a newer version of Adobe Flash Player.</h4>
        <p><a href="http://www.adobe.com/go/getflashplayer"><img src="http://www.adobe.com/images/shared/download_buttons/get_flash_player.gif" alt="Get Adobe Flash player" width="112" height="33" /></a></p>
      </div>
      <!--[if !IE]>-->
    </object>
    <!--<![endif]-->
  </object>
 
</div>
<div style="color:#FFF; font-size:16px; font-weight:400">
Dynamic glass is a family owned business that has been operating since 1999.  We pride ourselves on our professional service and quality
workmanship.  We specialise in pool fences, glass balustrading and glass splashbacks made and designed according to Australian standards and compliant with the glass code AS1288-2006.
We service all areas of Melbourne and can assist in all commercial and residential glazing if you are renovating your home then we are a
one stop shop for all your glass needs.

</div>

<!--============= Body Section Ends ================-->

<!--=========== Footer Section Starts ==============-->
<div class="footer">
<a href="#">Privacy Policy&nbsp;|</a></li>
<a href="#">About Us&nbsp;|</a>&nbsp;
<a href="#">Site Map&nbsp;|</a>&nbsp;
Copyright &copy;&nbsp;2011 Dynamic Glass, All Rights Reserved
&nbsp;&nbsp;&nbsp;&nbsp;<img src="images/facebook.png" alt="facebook" width="20" height="20" align="bottom" /><!--============= Footer Section Ends ==============-->
</div>
<script type="text/javascript">
swfobject.registerObject("FlashID");
</script>
</body>
</html>
styles2.zip (2.11 KB)
  • 2 Contributors
  • 1 Reply
  • 116 Views
  • 4 Hours Discussion Span
  • Latest Post Latest Post by hericles
Member Avatar for hericles

Here is what I did to make the 3 sections display beside each other;
take out the extra DIV around the contact form,
shrink the width of the object down from 100% to 70 or 75 (whatever works best for the size of the object being embedded)
move the object DIV to be above the contact form in the HTML
set the object CSS to include display: inline-block
make the contact-from CSS include float: right;

Hope that helps.

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.