473,657 Members | 2,475 Online
Bytes | Software Development & Data Engineering Community
+ Post

Home Posts Topics Members FAQ

float left and right on same line

3 New Member
http://www.hardwareforfree.com/
I'm trying to get the Consumer Gift Network image to be in the top right corner of the 800px area in the header. I have searched for hours and tried a lot of different things but it's still not working for me. I'm not very experienced so I'm sure it's something simple that I'm missing. Please look at the code below and tell me what I need to change.

Expand|Select|Wrap|Line Numbers
  1. ==============HEADER.TPL===================
  2.     <div id="header-control-div">
  3.         <div id="sub-logo-bar">
  4.             <h1><a href="{$site_url}">HardwareForFree</a></h1>
  5.             <p>&nbsp;</p>
  6.             <p style="line-height: 25%">Keep your money. Get it for FREE! &nbsp; <a href="javascript:pop('faq.htm')">How this works</a></p>
  7.             <p><br>&nbsp; &nbsp;<a href="login.php"><img src="images/icon_memberlogin.gif" width="11" height="14" border="0"> <font style="font-size: 11px; vertical-align: 10%;">Member Login</a></font></p>
  8.             <div id="account-info-box-home">
  9.                 <img style="float:right;" src="images/logo/cgn119x75.gif" width="119" height="75" border="0">
  10.             </div>
  11.         </div> <!-- END sub-logo-bar -->
  12.     </div> <!-- END header-control-div -->
  13.  
  14. ==============CSS=================
  15. #header-control-div    {    
  16.     width: 800px; height: auto;
  17.     margin: 0 auto; padding: 0;
  18.     }
  19.  
  20. #sub-logo-bar { 
  21.     background: transparent url('../images/bg/body-bg.jpg') 50% 0% no-repeat;
  22.     width: 800px; height: 100px;
  23.     }
  24.  
  25. #account-info-box-home {
  26.     width: 450px; height: auto;
  27.     display: block; float: right;
  28.     margin: 0 0 0 0; 
  29.     }
  30.  
  31. #sub-logo-bar h1 a {
  32.     background: transparent url('../images/logo/hardwareforfree202x35.gif') no-repeat left top;
  33.     display: block; float: left;
  34.     width: 202px;     height: 35px;
  35.     margin: 0 0 0 0 ; padding: 0;
  36.     text-decoration: none;
  37.     text-indent: -9999px;
  38.     outline: none; 
  39.     }
  40.  
  41. #account-info-box-home h1 a {
  42.     background: transparent url('../images/logo/cgn119x75.gif') no-repeat right top;
  43.     display: block; float: right;
  44.     width: 119px; height: 75px;
  45.     margin: 0 0 0 300px ; padding: 0;
  46.     text-decoration: none;
  47.     text-indent: -9999px;
  48.     outline: none; 
  49.     }
  50.  
Jul 8 '08 #1
4 3749
hsriat
1,654 Recognized Expert Top Contributor
First of all, for the whole page in a centered area of 800px, make a div (say wrapper) and add this to the CSS:
Expand|Select|Wrap|Line Numbers
  1. body {margin: 0 auto;}
  2. #wrapper {margin:0 auto; width:800px;}
Then try building the page inside the wrapper.

You have also messed up your HTML and CSS quite well. Have a look here.
Jul 8 '08 #2
erikirl
3 New Member
b u m p b u m p b u m p
Jul 10 '08 #3
erikirl
3 New Member
never mind i got it working
Jul 10 '08 #4
hsriat
1,654 Recognized Expert Top Contributor
never mind i got it working
Glad you fixed it.
Jul 10 '08 #5

Sign in to post your reply or Sign up for a free account.

Similar topics

5
2297
by: Chris Beall | last post by:
See http://pages.prodigy.net/chris_beall/BeallSprings/WC.Deed%20GG.116-17.html using the CSS at http://pages.prodigy.net/chris_beall/BeallSprings/BSstyle.css The page is a transcript of a deed. I'm trying to retain, somewhat, the layout of the original document. Below the deed are the signatures (on the right) and the names of witnesses (on the left), hence paired blocks of text.
4
2869
by: Chris Sharman | last post by:
I've a very simple page (intranet, but moved to http://services.ccagroup.co.uk/dtest.html for you - so the links are all broken). essentially it's just a list of links. I've split it into two columns with a floated left div, and therein lie the problems. It's valid 4.01 strict, but none of ie, moz, or ff correctly offset the
11
4054
by: Dennis | last post by:
Please bear with me ... I am a newbie to DIVs. Why does the following work in IE6, but not in NS7? ><!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 3.2//EN"> ><HTML> > ><HEAD> > <META HTTP-EQUIV="Content-Type" CONTENT="text/html; charset=iso-8859-1"> > <TITLE>DIV float Example</TITLE>
3
1764
by: hantechs | last post by:
<html> <body> <p style="width:30%;">text1</p> <p style="float:left;">text2</p> </body> </html> The effect of this html code is : text1 and text2 each is on a line. My question is: Why text2 is positioned on the right of text1? Because the CSS2.1 said: A floating element must be placed as high as possible; A left-floating element must be put as far to the left as possible; A
22
51494
by: ashkaan57 | last post by:
Hi, I am trying to put text on left and right side of the page and used: <div> <span>blah blah</span> <span style="float:right">blah blah</span> </div> The 2nd text does go to the right but the next line. What am I doing wrong? TIA.
2
3214
by: pbd22 | last post by:
Hi. I am learning my way around formatting DIVs and am stuck. Can somebody tell me how to format the below so the left column is, say, 30% wide and the right column is the remainder. And, there is a 5px space between the right and left columns? <div class="calTable"> <div class="calRow">
27
3859
by: GloStix | last post by:
WARNING VIDEO TAKES A WHILE TO LOAD http://screencast.com/t/BWQ6DNtsM I really don't know how to fix this other than putting another div. But I dont' exactly want to do that for every page. random div's everywhere Is there any other way? Also I'm trying to get a scaled thumbnail of the orginal picture WHILE maintaining the size of the css box.. Is that possible? Or do I have to scale it in Photoshop and make a separate image =\
2
2819
by: Ben C | last post by:
On 2008-04-08, Gus Richter <gusrichter@netscape.netwrote: Sometimes 0,0 of more than one container blocks occupy the same pixel on the screen, so this is not a good criterion. body float div In this example, 0,0 of div and body are in the same place because of
15
16595
dlite922
by: dlite922 | last post by:
I'm back again, Intro: I've got a floating div (outerDIV) with fixed width that contains an image (IMG) and a div that contains a short text (innerDIV) Problem: In FF, the innerDIV is displaying under the IMG because outerDIV is not wide enough to contain both of them (in some instances). In the instances where the outerDIV is wide, I don't have this problem. IE wraps the text but still keeps it to the right of the IMG. FF doesn't...
0
8323
by: Hystou | last post by:
Most computers default to English, but sometimes we require a different language, especially when relocating. Forgot to request a specific language before your computer shipped? No problem! You can effortlessly switch the default language on Windows 10 without reinstalling. I'll walk you through it. First, let's disable language synchronization. With a Microsoft account, language settings sync across devices. To prevent any complications,...
0
8739
jinu1996
by: jinu1996 | last post by:
In today's digital age, having a compelling online presence is paramount for businesses aiming to thrive in a competitive landscape. At the heart of this digital strategy lies an intricately woven tapestry of website design and digital marketing. It's not merely about having a website; it's about crafting an immersive digital experience that captivates audiences and drives business growth. The Art of Business Website Design Your website is...
1
8513
by: Hystou | last post by:
Overview: Windows 11 and 10 have less user interface control over operating system update behaviour than previous versions of Windows. In Windows 11 and 10, there is no way to turn off the Windows Update option using the Control Panel or Settings app; it automatically checks for updates and installs any it finds, whether you like it or not. For most users, this new feature is actually very convenient. If you want to control the update process,...
0
8613
tracyyun
by: tracyyun | last post by:
Dear forum friends, With the development of smart home technology, a variety of wireless communication protocols have appeared on the market, such as Zigbee, Z-Wave, Wi-Fi, Bluetooth, etc. Each protocol has its own unique characteristics and advantages, but as a user who is planning to build a smart home system, I am a bit confused by the choice of these technologies. I'm particularly interested in Zigbee because I've heard it does some...
0
7351
agi2029
by: agi2029 | last post by:
Let's talk about the concept of autonomous AI software engineers and no-code agents. These AIs are designed to manage the entire lifecycle of a software development project—planning, coding, testing, and deployment—without human intervention. Imagine an AI that can take a project description, break it down, write the code, debug it, and then launch it, all on its own.... Now, this would greatly impact the work of software developers. The idea...
0
5638
by: conductexam | last post by:
I have .net C# application in which I am extracting data from word file and save it in database particularly. To store word all data as it is I am converting the whole word file firstly in HTML and then checking html paragraph one by one. At the time of converting from word file to html my equations which are in the word document file was convert into image. Globals.ThisAddIn.Application.ActiveDocument.Select();...
0
4329
by: adsilva | last post by:
A Windows Forms form does not have the event Unload, like VB6. What one acts like?
2
1969
muto222
by: muto222 | last post by:
How can i add a mobile payment intergratation into php mysql website.
2
1732
bsmnconsultancy
by: bsmnconsultancy | last post by:
In today's digital era, a well-designed website is crucial for businesses looking to succeed. Whether you're a small business owner or a large corporation in Toronto, having a strong online presence can significantly impact your brand's success. BSMN Consultancy, a leader in Website Development in Toronto offers valuable insights into creating effective websites that not only look great but also perform exceptionally well. In this comprehensive...

By using Bytes.com and it's services, you agree to our Privacy Policy and Terms of Use.

To disable or enable advertisements and analytics tracking please visit the manage ads & tracking page.