I want to create a feature box for Eleven40 Pro Wordpress theme. Here’s the PHP I used:
add_action( 'genesis_after_header', 'genesis_featured_box' );
function genesis_featured_box() {
if ( is_front_page() && is_active_sidebar( 'featured-box' ) ) {
genesis_widget_area( 'featured-box', array(
'before' => '<div class="featured-box widget-area">',
'after' => '</div>',
) );
}}
And here’s my CSS
.featured-box {
-moz-border-radius: 10px;
-webkit-border-radius: 10px;
background-color: #000;
color: #fff;
border: 2px solid #ddd;
border-radius: 10px;
margin: 0 auto;
margin-top: 10px;
overflow: visible;
padding: 20px;
width: auto;
}
.featured-box h4 {
font-size: 20px;
color: #fff;
}
.featured-box p {
padding: 0 0 20px;
}
.featured-box ul {
margin: 0 0 20px;
}
.featured-box ul li {
list-style-type: disc;
margin: 0 0 0 30px;
padding: 0;
align: right;
}
.featured-box .enews p {
padding: 10 10 10 10px;
color: #fff;
float: left;
width: 220 px;
margin: 10 10 10 10px;
}
.featured-box .enews #subscribe {
padding: 20 20 20 20px;;
}
.featured-box .enews #subbox {
background-color: #fff;
margin: 0;
width: 300px;
}
.featured-box .enews .myimage {
float: right;
margin-left: 10px;
margin-right: 10px;
width: auto;
}
.featured-box .enews input[type="submit"] {
background-color: #d60000;
padding: 10 10 10 10px;
width: 150px;
}
.widget li {
border-bottom: none;
}
My problem is the top of feature box disappears beneath the navbar when I expand my browser window. You can see it here: http://bryancollins.eu/wp/.
How can I fix this? And is this easy to make this feature box responsive?
Thanks for the help.