neo
neo

Reputation: 89

CSS Responsive Desgn Footer taking whole space when screen size goes below 1180 px

As soon as I am reducing screen size to below 1180 px width, strange issue is occurring and right after header, thick black footer line(As seen in inspect element) is appearing just above slideshow. When I am looking at inspect element, header and other body element is showing height of "0". Can any one please guide me what is messed up here. Everything is fine when screen size is more than 1180 px

here is the site where i am getting these issue: http://goo.gl/8c1gW2

Upvotes: 0

Views: 278

Answers (1)

Anobik
Anobik

Reputation: 4899

:) :)

basically theres a #headerwrap{position:relative; margin-bottom:30px;padding-bottom: 20px; min-height: 70px; float: left;}

in the css name irms_default.css?ver=3.6.1

Heres the part of the css

@media screen and (min-width:0px) and (max-width:1180px){
body{/*overflow:hidden;*/text-align:center;}
.aq_block_faq, .testimonial-texts, .aq-posts-block {text-align:left;}
.testimonial-description {background:#000000;}
.breadcrumb-info{display:inline-block; float:none;}
/*footer*/
#footer{top:20px;}
.footer_widget1{margin-top: 30px; }
.twitterlink,.facebooklink,.vimeo,.dribble,.emaillink{float:none; padding:13px;}
.footer_widget .widgett{margin:5px auto 15px auto !important; padding:0;}
#footerb .copyright{padding-top:0px; margin-top:-4px;width:95% !important; text-align:left !important;}
.footer_widget .widget_search form div {padding:0;}
.socialfooter .socialcategory{width:225px; float:none; margin:0 auto; display: inline-block;}
.footer_widget .category_posts .widgett, .footer_widget .recent_posts .widgett{float:none;}

/*menu + header*/
#headerwrap{position:relative; margin-bottom:30px;padding-bottom: 20px; min-height: 70px; float: left;}
#logo {width:100%;float:left;position:relative; }

If you can edit it then its fine. Else give inline css #headerwrap as style="margin:0px" and test :) let me know the results :)

Upvotes: 1

Related Questions