sidebar help!

  • I am using a child theme of the thematic theme, which uses a primary-aside and a secondary-aside areas on the right sidebar. When I add something to the secondary-aside sidebar, it overlaps the primary-aside sidebar like this: https://kmfabric.com/.

    This is the code of my sidebar file, and I’m hoping someone can help me out with this:

    <?php thematic_abovemainasides(); ?>

    <?php if (is_sidebar_active(‘primary-aside’)) { ?>
    <div id=”primary” class=”aside main-aside”>
    <ul class=”xoxo”>
    <?php dynamic_sidebar(‘primary-aside’); ?>

    </div><!– #primary .aside –>

    <?php } ?>

    <?php thematic_betweenmainasides(); ?>

    <?php if (is_sidebar_active(‘secondary-aside’)) { ?>
    <div id=”secondary” class=”aside main-aside”>
    <ul class=”xoxo”>
    <?php dynamic_sidebar(‘secondary-aside’) ?>

    </div><!– #secondary .aside –>

    <?php } ?>

Viewing 12 replies - 1 through 12 (of 12 total)

  • Well…in your CSS for the class “aside”, that div is given a top margin of -70px.

    .aside{
	float:right;
	margin-right:5px;
	width:248px;
	margin-top:-70px;

}

    Perhaps the second div is being pulled up to sit on top of the first? That’s just a guess. But what you can do is try to override that to see if it fixes the problem:

    <?php if (is_sidebar_active('secondary-aside')) { ?>
<div id="secondary" class="aside main-aside" style="margin-top:0;">
<ul class="xoxo">
    Thread Starter am5

    (@am5)

    that worked perfect! Thank you!

    It moved the search box down exactly where I wanted it…do you have any idea how I can get the secondary-aside area to have the same container (the blue box its in) that the primary-aside area.

    OR

    I could just put all the widgets that I want to use in the primary-aside area, but I can’t figure out how to space them out (down).

    Sorry it took me so long to reply.

    The div#primary has that blue box with the rounded corners, created by this part of the CSS

    #primary{
	-moz-border-radius: 20px;
	border-radius: 20px;
	-webkit-border-radius: 20px;
	background-color: #d4d8d8
}

    You just need to copy that and add it to the div#secondaary (I think this will work anyway) Do a search in your CSS file for “#secondary” and add those last four lines:

    #secondary {
    clear:right;
    -moz-border-radius: 20px;
	border-radius: 20px;
	-webkit-border-radius: 20px;
	background-color: #d4d8d8
}
    Thread Starter am5

    (@am5)

    I can’t find a #secondary in the CSS file, could it be named something else, or can I add it in there somewhere?

    Thread Starter am5

    (@am5)

    Here is my CSS file:

    https://pastebin.ca/1731031

    I found it. It’s in this CSS file: wp-content/themes/thematic/library/layouts/2c-r-fixed.css

    Or you can just add to the CSS file that you just showed me:

    #secondary {
    -moz-border-radius: 20px;
	border-radius: 20px;
	-webkit-border-radius: 20px;
	background-color: #d4d8d8
}
    Thread Starter am5

    (@am5)

    where should I add it at?

    Thanks for all your help!

    You can try adding it to whichever CSS file you have available for your theme. It should work anywhere. But if not try to hunt down the 2c-r-fixed.css file that your site is using.

    Thread Starter am5

    (@am5)

    I got it, thanks for all your help!

    Thread Starter am5

    (@am5)

    One more issue (last one I promise)…I need to move it over to the right, and I tried to add padding to the CSS file, but it made it disappear, what am I doing wrong here??

    Thanks again

    Take off the padding, that will just push around the content inside the box. To scoot the whole thing over you’ll want to add

    margin-left:10px;

    To the #secondary, and adjust the 10px until you get it in the spot you want.

Viewing 12 replies - 1 through 12 (of 12 total)
  • The topic ‘sidebar help!’ is closed to new replies.