CSS issue with span - html

Question

I am trying to recreate a logo with plain text and CSS no images, the issue I have I can't seem to get padding to 0 around the text so that top and bottom text are only 2-5px apart.
Also is it possible to have them one on top of the other but not the have BIG TITLE CSS to
display:block
instead only to wrap around the text.
jSFiddle: http://jsfiddle.net/theStudent/ag60a6hs/
CSS:
/* FONT IMPORT */
#import url(http://fonts.googleapis.com/css?family=Roboto+Condensed:400,300,700);
.logo_large_txt{
color: #2faed9;
margin:0 0 0 0;
padding: 0 0 0 0;
font-family: 'Roboto Condensed', sans-serif;
font-weight: 700;
font-size: 36px;
background-color: #000;
white-space: nowrap;
display: block;
}
.logo_small_txt{
color: #c2c2c2;
padding: 0;
margin: 0;
font-family: 'Roboto Condensed', sans-serif;
font-weight: 700;
font-size: 16px;
background-color: #000;
white-space: nowrap;
}
HTML:
<div>
<span class="logo_large_txt">BIG TITLE</span>
<span class="logo_small_txt">SMALL CAPS</span>
</div>
Thanks

Answer 1

This isn't a padding issue, it's a line-height issue. Set line-height: 1em; on the relevant elements (those with text in them) and see how the height of the element now equals the size of the text.

Answer 2

Perhaps adding line-height might help, for example line-height:50% for logo_large_txt.

Answer 3

Yes this is line-height issue. You could set line-height to 1 or less on div and see the result.
For second part You should add <br /> tag between <span> tags.
fiddle or preview:
/* FONT IMPORT */
#import url(http://fonts.googleapis.com/css?family=Roboto+Condensed:400,300,700);
.logo_large_txt{
color: #2faed9;
margin:0 0 0 0;
padding: 0 0 0 0;
font-family: 'Roboto Condensed', sans-serif;
font-weight: 700;
font-size: 36px;
white-space: nowrap;
}
.logo_small_txt{
color: #c2c2c2;
padding: 0;
margin: 0;
font-family: 'Roboto Condensed', sans-serif;
font-weight: 700;
font-size: 16px;
white-space: nowrap;
}
div.logo {
line-height: 0.8;
display: inline-block;
background-color: #000;
}
<div class="logo">
<span class="logo_large_txt">BIG TITLE</span><br />
<span class="logo_small_txt">SMALL CAPS</span>
</div>