How do I place two 300x250 ads beside each other.

Discussion in 'HTML & Website Design' started by Matt Jo, Jul 26, 2011.

  1. #1
    I'm trying to place two 300x250 ads beside each other. So two squares side by side.

    I put in the following code twice but it just shows one on top of the other, not side by side, any help?

    <!-- BEGIN UAT - 300x250 - WeGotThisCovered: WeGotThisCovered - DO NOT MODIFY -->
    <script style="float:left;" type="text/javascript" src="http://ad-cdn.technoratimedia.com/00/43/05/uat_173.js?ad_size=300x250"></script>
    <!-- END TAG -->
     
    Matt Jo, Jul 26, 2011 IP
  2. drhowarddrfine

    drhowarddrfine Peon

    Messages:
    5,428
    Likes Received:
    95
    Best Answers:
    7
    Trophy Points:
    0
    #2
    There is no such thing as a style attribute for a script element which makes the rest of your code just nonsense.
     
    drhowarddrfine, Jul 26, 2011 IP
  3. Matt Jo

    Matt Jo Member

    Messages:
    155
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    26
    #3
    So how do I get the two ads beside each other?
     
    Matt Jo, Jul 26, 2011 IP
  4. Trix

    Trix Peon

    Messages:
    192
    Likes Received:
    1
    Best Answers:
    1
    Trophy Points:
    0
    #4
    <div>
      <div style="float:left">first ad code script comes here</div>
      <div style="float:right">second ad code script comes here</div>
      <div style="clear:both"></div>
    </div>
    Code (markup):
    Give widths if required to the two divs containing the ads
     
    Trix, Jul 26, 2011 IP
  5. Matt Jo

    Matt Jo Member

    Messages:
    155
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    26
    #5
    Hey, almost worked. I just want to close the space between them in the middle. Is there any way I can kind of pull them together or bring each image closer to the middle? Or even potentially put a third image in the middle?

    [​IMG]
     
    Matt Jo, Jul 26, 2011 IP
  6. Trix

    Trix Peon

    Messages:
    192
    Likes Received:
    1
    Best Answers:
    1
    Trophy Points:
    0
    #6
    change the float "right" to "left"

    you may also give margin or padding to the second ad's div using the following

    padding-left: 10px

    or

    margin-left: 10px

    This creates a small space between the two ads....
     
    Trix, Jul 26, 2011 IP
  7. Matt Jo

    Matt Jo Member

    Messages:
    155
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    26
    #7
    Almost got it, just need to move the middle ad over to the right a bit, any idea?

    [​IMG]
     
    Matt Jo, Jul 26, 2011 IP
  8. Matt Jo

    Matt Jo Member

    Messages:
    155
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    26
    #8
    I tried to put the padding in but I'm not sure where to put it.
     
    Matt Jo, Jul 26, 2011 IP
  9. Trix

    Trix Peon

    Messages:
    192
    Likes Received:
    1
    Best Answers:
    1
    Trophy Points:
    0
    #9
    <div>
    <div style="float:left">first ad code script comes here</div>
    <div style="float:left; margin-left:10px;">second ad code script comes here</div>
    <div style="clear:both"></div>
    </div>

    if margin-left did not work.. try padding-left,

    change the 10px as required, depending on how much space you want...

    Padding : Space between element to which it is applied and the inner elements
    Margin : Space between element to which it is applied and element around it
     
    Trix, Jul 26, 2011 IP
  10. creativewebmaster

    creativewebmaster Active Member

    Messages:
    654
    Likes Received:
    7
    Best Answers:
    4
    Trophy Points:
    78
    #10
    Hello,

    Create the two div and create the CSS. for the first div give margin around 10 px.

    Thanks,
     
    creativewebmaster, Jul 27, 2011 IP