How to get rid of white space

[carter90]

I have been looking around to try and figure out why there is a big gap at the top of this slider and I really don't know how to get rid of it.

 

 

<h1><span style="color: #3b853f;">WELCOME TO INSURED CARS</span></h1>

One low cost, monthly payment with insurance included. Protecting the public from high premiums......

<div class="space" style="height: 5px;"></div>

<h4><img class="alignnone size-large wp-image-1352" alt="revolution-tick" src="http://insuredcarsonline.com/wp-content/uploads/2013/01/revolution-tick1.jpg" width="19" height="20" /><span style="color: #000000;"> INSURANCE INCLUDED</span></h4>

<h4><img class="alignnone size-large wp-image-1352" alt="revolution-tick" src="http://.com/wp-content/uploads/2013/01/revolution-tick1.jpg" width="19" height="20" /><span style="color: #000000;"> LOW INITIAL PAYMENT</span></h4>

<h4><img class="alignnone size-large wp-image-1352" alt="revolution-tick" src="http://.com/wp-content/uploads/2013/01/revolution-tick1.jpg" width="19" height="20" /><span style="color: #000000;"> ROAD TAX AND SERVICING INCLUDED</span></h4>

<h4><img class="alignnone size-large wp-image-1352" alt="revolution-tick" src="http://.com/wp-content/uploads/2013/01/revolution-tick1.jpg" width="19" height="20" /><span style="color: #000000;"> CURFEW FREE SAFE DRIVING AID</span></h4>

<h4><img class="alignnone size-large wp-image-1352" alt="revolution-tick" src="http://.com/wp-content/uploads/2013/01/revolution-tick1.jpg" width="19" height="20" /><span style="color: #000000;"> COMPLETE DATA CONFIDENTIALITY</span></h4>

<h4><img class="alignnone size-large wp-image-1352" alt="revolution-tick" src="http://.com/wp-content/uploads/2013/01/revolution-tick1.jpg" width="19" height="20" /><span style="color: #000000;"> GUARANTEED FIXED PRICE INSURANCE</span></h4>

<h4><img class="alignnone size-large wp-image-1352" alt="revolution-tick" src="http://.com/wp-content/uploads/2013/01/revolution-tick1.jpg" width="19" height="20" /><span style="color: #000000;"> ACCIDENT PROOF POLICY</span></h4>

 

[computermax2328]

To find a solution we would have to see the CSS. Immediately, just by looking at the thumbnail it obviously seems to be a margin or padding problem. You can also set the div that all of these headers are in to position: relative. That could help.

[carter90]

Thanks for the advice. I have changed h1 and h4 to position:relative; and margin-top:0px; which didn't change anything unfortunately. I have pasted below the CSS:

 

 

 

body, p, li, address, dd, blockquote {  } 

h1, h2, h3, h4, h5, h6, p, dl { margin:0.8em 0 0.8em; }          

a, a:hover { text-decoration:none; outline: none !important; }

h1, h2, h3, h4, h5, h6 { font-weight: 800; }

h1, h1 a { font-size:22px; line-height: 22px; }

h2, h2 a { font-size:20px; line-height: 20px; }

h3, h3 a { font-size:17px; line-height: 17px; }

h4, h4 a { font-size:16px; line-height: 16px; }

h5, h5 a { font-size:15px; line-height: 15px; }

h6, h6 a { font-size:14px; line-height: 14px; }

.content ul { margin-left:20px; list-style:square }

.content ol { margin-left:40px; }

i, em { font-style:italic; }

strong { font-weight:bold; }

.content blockquote { background:url('./core/assets/images/cite.png') no-repeat 45px 25px; padding:35px; }

.content blockquote p { padding-left: 45px; }        

.border-line { height:1px; background:#CFCFCF; width:100%; clear:both; margin:1.2em 0; }

dt { font-weight:bold; }

mark { background: transparent !important; }

 

a { color: #9A6614; }

a:hover { color: #815207; }

.sidebar a { color: #575858; }

.sidebar a:hover { color: #9A6614; }

a:hover .title-highlight { color: #6C6D03; }

 

.line { border-top:1px solid #CFCFCF }

.space { height:30px }

body .last, body .widget-last { margin-right:0; padding-right:0 !important; border-right:0; }

body .last-row { margin-bottom:0; }        

.for-mobile { display:none !important; }  

.not-logged-in .not__logged_in { display:none !important; }

 

p, li, address, dd, blockquote, td, th, a,

body, h1, h2, h3, h4, h5, h6, p, dl, ul, ol,

.paragraph-links a, #respond input, #respond textarea, #respond p label, #search_mini {

    color: #666767;

    font-family: 'Play', 'Verdana', 'Arial', sans-serif;

    font-size: 12px;

    font-weight: normal;

    line-height: 20px;

}

code, pre { background-color: #E8EBEC; border: 1px dotted #CFCFCF; color: #333333; font: 13px/18px Consolas,"Courier New",Courier,monospace; padding: 0 5px; }

pre { margin-bottom: 10px; margin-top: 10px; }

 

.margin-top { margin-top: 10px; }

.margin-bottom { margin-bottom: 20px; }

 

/* ===== SIDEBAR LAYOUT ===== */

.sidebar-left .sidebar, .sidebar-right .content { float: left; }

.sidebar-right .sidebar, .sidebar-left .content { float: right; }

 

/* ===== HEADINGS ===== */

h1, h2, h3, h4, h5, h6,

h1 a, h2 a, h3 a, h4 a, h5 a, h6 a {

font-size: 12px;

}

h1 span.highlight, h2 span.highlight, h3 span.highlight, h4 span.highlight, h5 span.highlight, h6 span.highlight { color: #c27d05; background-color: transparent !important; }

 

#primary .content .hentry > h1:first-child,

#primary .content .hentry > h2:first-child,

#primary .content .hentry > h3:first-child,

#primary .content .hentry > h4:first-child,

#primary .content .hentry > h5:first-child,

#primary .content .hentry > h6:first-child,

#primary .content .hentry > p:first-child { /*margin-top: 0px;*/ }

 

/* ===== MAIN LAYOUT ===== */

body {

    position: relative;

}

body.responsive {

overflow-x: hidden;

}

.boxed #wrapper {

    padding: 0px 20px;

    background: #fff;

    position:relative;

}

.boxed #header, .boxed #topbar, .boxed #footer, .boxed #copyright {

margin-right: -20px;

;

}

.stretched #wrapper.container {

    width: 100%;

}

.boxed .wrapper-border { position: absolute; width: 100%; height: 100%; border: 8px solid rgba(0, 0, 0, 0.04); left: -8px; top: -8px; border-radius:8px; -moz-border-radius:8px; -webkit-border-radius:8px; z-index:-1; }

 

/* ===== TOPBAR ===== */

#topbar {

    padding: 10px 0;

    text-transform: uppercase;

    padding-bottom: 0

}     

#topbar .row { margin-bottom: 4px }

 

#topbar-left { float: left; }

#topbar-right { float: right; }

 

#topbar-left div.widget, 

#topbar-right div.widget { display: inline-block; vertical-align: top; margin-right: 15px }

 

#topbar .widget.widget_nav_menu { margin: 0 }

#topbar .widget_nav_menu ul { margin: 0 }

#topbar .widget_nav_menu ul > li:first-child { margin-left: 0 }

#topbar .widget_nav_menu ul > li { float: left; border: none !important; margin-left: 10px }

#topbar .widget_nav_menu ul > li a { border: none !important; padding: 0; background: none }

 

.border { border: 1px solid #e0dfdf; height: 1px; padding-bottom: 2px; border-width: 0 0 1px 0 }

.borderstrong { border-width: 0 0 4px 0 !important; }

.borderpadding { margin-bottom: 3px }

 

/* ===== HEADER ===== */

#header {

    position: relative;

    /*margin-bottom:21px;*/

    /*height: 105px;*/

}    

 

/* === LOGO */

#logo-headersidebar-container { position:relative; min-height: 125px }  

#logo {

    text-transform: uppercase;

    padding:10px 0 5px 0;

    width: 257px;

    margin-left: 18px;

    margin-top: 5px;

    float: left;

}

.align-left #logo{ text-align:left; }

.align-right #logo{ text-align:right; }

 

#logo #textual { display: inline-block; margin-top: 20px; margin-bottom: 12px; line-height: 1em; }

 

#header #tagline { margin: 0 0 0 0; text-transform: none; font-size: 15px;  }

#header #tagline.multiline { margin-top: 10px }

 

#header #logo #tagline span { color: #E5F99A }    

#header #logo #textual, #header #logo #textual span { font-size: 40px; }

 

 

/* === */

#header-sidebar { float: right; max-width: 342px; }

#header-sidebar.double { max-width:684px; }

#header-sidebar .widget, #header-sidebar .widget-last {

    display:inline-block; 

    vertical-align: top;

    width: 170px;

    border: 1px solid #E0DFDF;

    height: 48px;

    margin-top: -1px !important;

    ;

}

 

#header-sidebar .widget.text-image { padding-top: 15px; margin-top: -1px !important; padding-bottom: 6px }

#header-sidebar .widget.text-image, 

#header-sidebar .widget.text-image h3, 

#header-sidebar .widget.text-image p, 

#header-sidebar .widget.text-image a,

#header-sidebar .widget_text.widget { 

font-family:'Oswald', sans-serif; 

font-size:14px; 

color:#8d8d8d; 

font-weight: normal;

margin: 0;

}

#header-sidebar .widget.text-image h3, #header-sidebar .widget.text-image p {

float: left;

display: block;

}

#header-sidebar .widget.text-image h3 { margin-top: 6px; color:#373736; }

#header-sidebar .widget.text-image .text-image { 

float:left; 

padding-right:5px; 

padding-left:10px;

}

 

#header-sidebar .widget_text.widget { width: 341px; height: 40px; padding-top: 24px; text-align: center; font-size: 18px; padding-bottom:5px; }

#header-sidebar .widget_text.widget h3 { display: inline-block; margin-right: 5px; }

#header-sidebar .widget_text div { margin: 0px -2px 0px -1px; float: none !important; display: inline-block; line-height: 23px }

 

#header-sidebar a.socials-square, 

#header-sidebar a.socials-square-small, 

#header-sidebar a.socials-default, 

#header-sidebar a.socials-default-small, 

#header-sidebar a.fade-socials, 

#header-sidebar a.fade-socials-small { vertical-align:top; }

[computermax2328]

What are all of these h4s and the one h1 wrapped in? It looks like they have an element around them. That needs to be relative or have no margin.