WordPress.org

1. bfranker
   Member
   Posted 1 year ago #
   

   Hello!

   I *think* this is because the area my calendar is in may be a little too narrow but not 100% sure. It LOOKS like it should be wide enough. Can somebody help me with the code I need to adjust to get the buttons back together? Here is what I am talking about...

   http://www.joycescourtsidepub.com/?page_id=46

   Thanks!!!

   http://wordpress.org/extend/plugins/all-in-one-event-calendar/

2. bfranker
   Member
   Posted 1 year ago #
   

   FYI, I just used the WordPress template for the page which took out all the sidebars and made the calendar full width but it still has the spacing between the buttons so it doesn't appear to be a width issue.

3. edgarcia78
   Member
   Posted 1 year ago #
   

   Are you running IE9? If so, try using firefox to see if you have the same issue. I had a similar issue with the buttons and realized it was an IE9 compatibility problem. A work around is to do the following:

   1. Go to the theme editor under "Apperance".
   2. Click on the header.php link
   3. Add the following code after the first "<meta" tag line.
   <meta http-equiv="X-UA-Compatible" content="IE=EmulateIE8" >

   This will make your theme compatible with IE9 by emulating IE8

4. bfranker
   Member
   Posted 1 year ago #
   

   Thank you for the reply, edgarcia78. I am using IE9. Does it look ok to you in the link I had above? I'm on a computer right now using IE7 and it looks more messed up than it does with IE9. In IE7 not only are the buttons for the months spread apart but the calendar views are now stacked on top of each other. I just tried an older version of Firefox and it looks just like it does in IE9. Can you tell me if the link looks OK to you in your browser? Thanks!

5. edgarcia78
   Member
   Posted 1 year ago #
   

   I see what you mean. I just checked the link with Firefox and safari and the buttons are spread out. Have you tried changing back to the default theme? This will tell you right away if it's a theme issue. If so, you should play around with the style.css button to adjust your layout. If its not a theme issue, try downgrading to the previous version of all in one event calendar. My guess is that your theme doesn't like the plugin.

6. edgarcia78
   Member
   Posted 1 year ago #
   

   Also, I'm not sure if you modified the plugin CSS, but this would definitely cause an issue.

7. bfranker
   Member
   Posted 1 year ago #
   

   Thanks! I just tried 5 other themes and in all the other themes the buttons to scroll through the month are OK but the view buttons are all messed up. LOL So, it does seem like it could be related to the theme.

   I haven't modified the CSS. But it would be nice to know how to modify it to fix it. LOL (I'm not a coder :) )

8. Rick Radko
   Member
   Posted 1 year ago #
   

   It's the theme css, it's setting a left margin (margin-left: 2.8em ) on the li item, and the calendar uses li for the button structure, and unfortunately does not set it's own css for li.

   From your theme css:
   li {
   margin-bottom: 0.5em;
   margin-left: 2.8em; <<< THIS is the problem ****
   padding: 0;
   }

   The following css will reset the margin for the buttons only. Just add it to a css file that is loaded after the theme css (or follow the theme's instructions below):

   ai1ec-pagination li {
   margin-left: 0;
   }

   The following is from your theme css file and tells you where/how to add a custom css file.

   !!!!!!!!!! DO NOT EDIT THIS FILE !!!!!!!!!!
   If you need to make changes to this theme, create a new stylesheet in the wp-content folder then go to the 'Wordpress Admin > Settings > Adventure Journal' and add your new stylesheet under the 'Custom Stylesheet' section. This will prevent your changes from being overwritten when new versions of this theme is released.
   !!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!

9. bfranker
   Member
   Posted 1 year ago #
   

   Thanks for the reply, r3df! I gave that a shot by creating a custom css file and put only what you have above in that file. I then added that css file using the Theme Options. Nothing seemed to change? I have to head out now but I'll try to take a look again to see if I might have messed something up but I don't think I did???

   Thanks!!!

10. Rick Radko
    Member
    Posted 1 year ago #
    

    @bfranker

    You're missing the dot (.) at the start of ai1ec-pagination. Looks like I missed it above in my cut and paste.

    .ai1ec-pagination li {
    margin-left: 0;
    }

11. bfranker
    Member
    Posted 1 year ago #
    

    Sweet! I just changed it and now it works like a charm. Thanks for coming back and posting what you found and helping me out. Much appreciated!!!

Topic Closed

This topic has been closed to new replies.