SitePoint Sponsor

User Tag List

Results 1 to 7 of 7
  1. #1
    SitePoint Addict
    Join Date
    Jul 2002
    Posts
    286
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Question Can't get ads centered

    All of the ad units in the sidebar shown on this page are contained within their own individual divs, and all of those divs are contained within "div id="ads"." The CSS for #ads includes "text-align: center". Everything is obeying that attribute in Win IE6, but in all other browsers, the Google AdSense skyscraper is the only one obeying; the graphic ad and text ad above the Google skyscraper are both aligned left.
    HTML and CSS both validate.
    Anyone wanna take a stab?

  2. #2
    The CSS Clinic is open silver trophybronze trophy
    Paul O'B's Avatar
    Join Date
    Jan 2003
    Location
    Hampshire UK
    Posts
    40,549
    Mentioned
    183 Post(s)
    Tagged
    6 Thread(s)
    HI,

    text-align only centers text in good browers. You need to use margin auto on an element of specified width in order to center for firefox and the like.

    e.g.
    Code:
    #ads div{margin:auto;}
    #ads .central{margin:auto;width:175px}
    Code:
    	<h2>Sponsors</h2>
    	<div id="ads">
    	 <div class="central">
    	 <script type="text/javascript" src="<A href="http://proxy.blogads.com/kpoepxoxjuicvtidpn/vanhalenmusiccom/feed.js"></script">http://proxy.blogads.com/kpoepxoxjuicvtidpn/vanhalenmusiccom/feed.js"></script>
    	 </div>
    	 <!-- Begin: AdBrite -->
    	 <div id="adbrite">

  3. #3
    SitePoint Zealot taledo's Avatar
    Join Date
    Feb 2006
    Location
    Sydney
    Posts
    129
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Paul, When are you going to write a book?
    Aha... Victory is mine!!!

  4. #4
    SitePoint Addict
    Join Date
    Jul 2002
    Posts
    286
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    I second that, Taledo.
    As always, Paul, thanks for helping me out. Your CSS knowledge continues to astound me.

  5. #5
    SitePoint Addict
    Join Date
    Jul 2002
    Posts
    286
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Paul (or anyone):

    I needed to add some stuff to the sidebar, and seem to have thrown things out of whack in the process.

    The first ad ("Advertise on ... ") appears properly centered.
    The subsequent two ads (laptop and Google AdSense) have more space on the left than on the right. I'm picking through the CSS, but can't figure it out. Any help would be appreciated. Thanks in advance.

  6. #6
    The CSS Clinic is open silver trophybronze trophy
    Paul O'B's Avatar
    Join Date
    Jan 2003
    Location
    Hampshire UK
    Posts
    40,549
    Mentioned
    183 Post(s)
    Tagged
    6 Thread(s)
    Hi,

    You need to use margin:auto on elements that have a specifed width in order to center them.

    Code:
    #freelap {
    width: 156px;
    background-color: #000;
    margin: 30px auto 30px auto;
    border: 2px solid #C8070A;
    }
    #google {
    padding: 15px 0;
    width:160px;
    margin:auto
    }
    #adstrip table{margin:auto}

  7. #7
    SitePoint Addict
    Join Date
    Jul 2002
    Posts
    286
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Thanks, Paul. Before I got your response, I decided to pretty much gut that whole section and put it back together using some (relatively) more-streamlined CSS.
    The original CSS is my mod of a WordPress default CSS. Seems I get lost in the midst of all of that sometimes when I'm trying to make my own modifications.
    At any rate, I seem to have the ads properly positioned now, and I appreciate your time and assistance, as usual.


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •