How to Align Html Left and Center on Same Line ?

Discussion in 'HTML & Website Design' started by Knight1234, Apr 1, 2008.

  1. #1
    Hey Guyz, can someone Help me.
    I want to Align my Adsense Banner on Left Side, and on the Same Line i want to display my Chatbox, which is coded with HTML. But the problem is, that when i do <a align="left">Put the Ad code here</a><center>Chatbox html here</center> it doesnt work, the chatbox comes in center but below the banner :S, i want both of them on same line.
    Thanks.
     
    Knight1234, Apr 1, 2008 IP
  2. mr_wonderful

    mr_wonderful Peon

    Messages:
    128
    Likes Received:
    4
    Best Answers:
    0
    Trophy Points:
    0
    #2
    Nobody will be able to help you with this much information. but it sounds like you may need to add a style="display:inline;" to one or more elements.
     
    mr_wonderful, Apr 1, 2008 IP
  3. lbalance

    lbalance Peon

    Messages:
    381
    Likes Received:
    18
    Best Answers:
    0
    Trophy Points:
    0
    #3
    probably use <div>'s with float property
     
    lbalance, Apr 1, 2008 IP
  4. Knight1234

    Knight1234 Peon

    Messages:
    345
    Likes Received:
    2
    Best Answers:
    0
    Trophy Points:
    0
    #4
    Ok, thanks, and btw what more Info you need ?
    Btw, this is the HTML code I am trying, if you want to look:
    <p>a align="left"><!-- Begin: AdBrite -->
    <script type="text/javascript">
       var AdBrite_Title_Color = 'CC0000';
       var AdBrite_Text_Color = 'FFFFFF';
       var AdBrite_Background_Color = '000000';
       var AdBrite_Border_Color = 'FFFFFF';
       var AdBrite_URL_Color = '008000';
    </script>
    <script src="http://ads.adbrite.com/mb/text_group.php?sid=630578&zs=3132305f363030" type="text/javascript"></script>
    <div><a target="_top" href="http://www.adbrite.com/mb/commerce/purchase_form.php?opid=630578&afsid=1" style="font-weight:bold;font-family:Arial;font-size:13px;">Your Ad Here</a></div>
    <!-- End: AdBrite --></a><center><script src="http://www.mogulus.com/scripts/playerv2.js?channel=d2link&layout=playerEmbedWide&backgroundColor=Black&backgroundAlpha=1&backgroundGradientStrength=0&chromeColor=0x000000&headerBarGlossEnabled=true&controlBarGlossEnabled=true&chatInputGlossEnabled=true&uiWhite=true&uiAlpha=0.5&uiSelectedAlpha=1&dropShadowEnabled=true&dropShadowHorizontalDistance=10&dropShadowVerticalDistance=10&paddingLeft=10&paddingRight=10&paddingTop=10&paddingBottom=10&cornerRadius=3&backToDirectoryURL=null&bannerURL=null&bannerText=null&showViewers=true&embedEnabled=true&chatEnabled=true&programGuideEnabled=false&fullScreenEnabled=true&reportAbuseEnabled=false&gridEnabled=false&initialIsOn=true&initialIsMute=false&initialVolume=10&width=700&height=700&wmode=window' type="text/javascript"></script></center></p>
    Code (markup):
     
    Knight1234, Apr 1, 2008 IP
  5. wd_2k6

    wd_2k6 Peon

    Messages:
    1,740
    Likes Received:
    54
    Best Answers:
    0
    Trophy Points:
    0
    #5
    Try this:

    <div style="float:left">AD CODE HERE</div>
    <div style="float:left">CHATBOX CODE HERE</div>
    <div style="clear:both"></div>
     
    wd_2k6, Apr 1, 2008 IP
  6. Knight1234

    Knight1234 Peon

    Messages:
    345
    Likes Received:
    2
    Best Answers:
    0
    Trophy Points:
    0
    #6
    Ok thanks, btw i want chatbox in center
     
    Knight1234, Apr 1, 2008 IP
  7. elias_sorensen

    elias_sorensen Well-Known Member

    Messages:
    852
    Likes Received:
    20
    Best Answers:
    0
    Trophy Points:
    110
    #7
    something like this?:

    <div style="float:left;">AD CODE</div>
    <div style="position:absolute;margin-left:auto;margin-right:auto;width:500px;">CHATBOX</div>

    No tested, but thinks it works.
     
    elias_sorensen, Apr 1, 2008 IP
  8. Knight1234

    Knight1234 Peon

    Messages:
    345
    Likes Received:
    2
    Best Answers:
    0
    Trophy Points:
    0
    #8
    eh, Wd2k6's works...:p
     
    Knight1234, Apr 1, 2008 IP
  9. bjorn.trolin

    bjorn.trolin Peon

    Messages:
    12
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    0
    #9
    style="position:absolute;margin-left:auto;margin-right:auto;width:500px; puts my "center" pic upon my float:left

    Have a look: http://www.cribsnorge.se/sommarjobb-i-norge
     
    bjorn.trolin, Jun 5, 2011 IP
  10. TB Adriana

    TB Adriana Greenhorn

    Messages:
    52
    Likes Received:
    1
    Best Answers:
    0
    Trophy Points:
    18
    #10
    I think it's best to go this way too. Alternatively you can achieve the same thing by making an id for your divs... e.g. <div id="ad"> and then change floating properties from style.css
     
    TB Adriana, Jun 6, 2011 IP