new widget area with border
Hi all,
I'm not so good in programming and very bad in css... I use WP 3.0 and Atahualpa 3.5.3 Here is my WP blog : www.leparloir.ch I try to made my blog more like a magazine theme but really love Atahualpa functionnality and so try to do what I want with it. I like the default style of widget in the right side bar with grey border around each widget. I would like to put a widget area horizontally under the first post. And I did it with "add new widget areas". Actually I put this code on the begenning of the loop in "style and edit center column section" : <?php if ( is_front_page() AND $bfa_ata['postcount'] == 2 ) { ?> <?php bfa_widget_area('name=My widget area&cells=3&align=2&width_1=200&width_2=200&width _3=200&width_4=200&before_widget=<div id="%1$s" class="header-widget %2$s">&after_widget=</div>'); ?> <?php } ?> But no grey border... So how can I make look my news widgets just like in my right bar ? I guess I have to change some reference to css style but as I said I'm not really good in css and php... I hope that someone can help me. Best regards Charles |
You would use the following to ATO>Add HTML/CSS Inserts>CSS Inserts to style the 3 new widget areas the same as the sidebars
HTML Code:
#my_widget_area_1, #my_widget_area_2, #my_widget_area_3 { HTML Code:
<?php bfa_widget_area('name=My widget |
If I do the above CSS to add borders, on Firefox, Chrome and Safari, my three widgets stack top to bottom. On IE they are side by side which is what I want. How do I get side by side WITH borders? Many thanks!
|
Sorry too quick on the draw... I deleted the block command. Am learning quickly! Love ATO
|
I'm struggling with getting space between my new widget areas. I've tried assigning widths, padding, margin, etc.. all to no avail.
it says the widget areas will take up the space they are allotted. (they are in center column), but I want them to have some space between them. I've added borders and padding (inside cell), but can't get them to separate. http://4legsandatail.org/ here's my code: it is a work in progress, so i've had "margin-left: 20px", etc.. in there. I'm likely missing something simple, but need a little life-line! #mainwidget1_1, #mainwidget1_2, #mainwidget2_1, #mainwidget2_2, #mainwidget3_1, #mainwidget3_2 { border: solid #660000; border-left-width:2px; border-right-width:2px; border-top-width:2x; border-bottom-width:2px; padding: 10px; } Quote:
|
You have a few syntax issues with your CSS. You have
HTML Code:
#mainwidget1_1, #mainwidget1_2, #mainwidget2_1, #mainwidget2_2, #mainwidget3_1, #mainwidget3_2{ HTML Code:
border: solid #660000; HTML Code:
border: 2px solid #660000; What that says is 'apply this css to any TD element that is the child of an element with a class of 'mainwidget1_1' - well there are no 'td's inside so this selector applies to nothing. what you want is something like 'td#mainwidget1_1' |
Thank you so much for that!!! I'm a bit embarrassed to say that the whole "class/Id" thing has eluded my brain a bit. I'm going to have to do a little more reading. Up until now, I've not had to deal with it. Your description makes a ton of sense, but I need to get that nailed down for myself. I have a feeling I'll enter a whole new fun world of customization once I get it straight in my head!!
Thanks again! |
I had the same issue with class and ID's - here is the rule
ID uses the '#' - must be unique on the page CLASS's use the '.' - can occur on any number of elements |
All times are GMT -6. The time now is 07:49 PM. |
Powered by vBulletin® Copyright ©2000 - 2024, Jelsoft Enterprises Ltd.