Announcement

Collapse
No announcement yet.

Additional.css not showing up

Collapse
X
 
  • Filter
  • Time
  • Show
Clear All
new posts

  • [vB4] Additional.css not showing up

    I added a DIV section with 3 240x60 images under the Quick Reply box, then added the new CSS to the additional.css file. I can not get it to load. It does not show up in Firebug.

    I tried the Cntrl F5 and it didnt update.

    What could be the problem?
    Attached Files

  • #2
    Would need to see a link to the problem.
    Translations provided by Google.

    Wayne Luke
    The Rabid Badger - a vBulletin Cloud demonstration site.
    vBulletin 5 API

    Comment


    • #3
      Originally posted by Wayne Luke View Post
      Would need to see a link to the problem.
      Thanks I PM'ed you a link.

      Comment


      • #4
        In the link provided, the additional.css is definitely being added because it controls 90% of your style. I don't see any additional DIVs in the source code of the page though. What template did you add the HTML code for these DIVS to?
        Translations provided by Google.

        Wayne Luke
        The Rabid Badger - a vBulletin Cloud demonstration site.
        vBulletin 5 API

        Comment


        • #5
          Originally posted by Wayne Luke View Post
          In the link provided, the additional.css is definitely being added because it controls 90% of your style. I don't see any additional DIVs in the source code of the page though. What template did you add the HTML code for these DIVS to?
          The gray boxes on the bottom of the quick reply is where the divs are: (240x60 boxes)
          Code:
          <div id="240spots">
          <div id="240spot"><img src="spot.jpg" /></div>
          <div id="240spot"><img src="spot.jpg" /></div>
          <div id="240spot"><img src="spot.jpg" /></div>
          <div style="clear:left;"></div>
          </div>
          CSS added:

          Code:
          #240spots {
              margin-left:auto;
              margin-right:auto;
              width:800px;
          }
          #240spot {
              float:left;
              width: 250px;
          }

          Comment


          • #6
            You cant see that portion because you arent logged in, but you can see it in the picture.

            I added it to the SHOWTHREAD template

            Comment


            • #7
              The following works in my browsers (Firefox 9, IE 9, Chrome 16, Safari 5)

              You'll need to play with margins and centering. Background colors are set for emphasis.

              HTML Code:
              <html xmlns="http://www.w3.org/1999/xhtml">
              
              <head>
                <title></title>
                <style>
                  #spots_wrapper {
                      margin-left:auto;
                      margin-right:auto;
                      width:800px;
                      background-color: green;
                      text-align:center;
                  }
              
                  .spot {
                      display: inline-block;
                      float:left;
                      width: 250px;
                      height: 50px;
                      background-color: blue;
                      border: 1px solid black;
                      margin: 0px 3px;
                  }
                </style>
              </head>
              
              <body>
              <div id="spots_wrapper">
              <div class="spot">spot #1</div>
              <div class="spot">spot #2</div>
              <div class="spot">spot #3</div>
              <div style="clear:left;"></div>
              </div>
              </body>
              
              </html>
              Good luck.
              Translations provided by Google.

              Wayne Luke
              The Rabid Badger - a vBulletin Cloud demonstration site.
              vBulletin 5 API

              Comment


              • #8
                Thanks, I'll try it.

                Comment


                • #9
                  Weird, its not the styling... The added code I put in additional.css is showing up.

                  Comment


                  • #10
                    I figured it out. I had the ID selector starting with 240... so it wasnt reading it at all. Classes can start with a number, IDs can not.

                    *inserts Homer Doh pic*

                    Comment

                    Related Topics

                    Collapse

                    Working...
                    X