Det er flere muligheter, men du må altså sette bredden på den store knappen til 100% minus bredden på den lille knappen.
Det enkleste er å bruke calc(), men det er CSS3 og virker ikke overalt.
Så kan du bruke wrappers, altså flere elementer inne i hverandre, og trikse og ordne litt så de fyller helt.
Det greieste, som virker overalt, er egentlig bare å bruke et table element, og sette hver knapp i en celle.
Jeg ville forandret litt, og som kek91 nevner, tatt bort inline javascript og css osv, og gjort det slik
PHP:
<table class="wrapper">
<tr>
<td>
<a class="button facebook" title="Klikk her for å dele dette på Facebook" href="http://www.facebook.com/share.php?u=<url>" target="_blank">
<img src="/bilder/f-ico.png" />
Del på Facebook
</a>
</td>
<td>
<div class="fb-like" data-href="https://developers.facebook.com/docs/plugins/" data-layout="button_count" data-action="like" data-show-faces="true" data-share="false"></div>
</td>
</tr>
</table>
<div id="fb-root"></div>
<script type="text/javascript">
(function(d, s, id) {
var js, fjs = d.getElementsByTagName(s)[0];
if (d.getElementById(id)) return;
js = d.createElement(s);
js.id = id;
js.src = "//connect.facebook.net/nb_NO/sdk.js#xfbml=1&appId=***********&version=v2.0";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));
document.querySelector('.button.facebook').addEventListener('click', function(e) {
e.preventDefault();
var u = location.href,
t = document.title;
window.open('http://www.facebook.com/sharer.php?u=' + encodeURIComponent(u) + '&t=' + encodeURIComponent(t), 'sharer', 'toolbar=0,status=0,width=626,height=436');
}, false);
</script>
merk at javascript nå må komme etter elementene for at de skal være tilgjengelige (eller du må bruke en eller annen for "DOM ready").
Når du styler det, så ville jeg gjort noe sånt
PHP:
.wrapper {
width : 100%;
}
.button.facebook {
position : relative;
width : 100%;
display : block;
padding : 10px 0;
font-family : Lucida Grande, Tahoma !important;
font-size : 22px;
text-align : center;
text-decoration : none;
color : #fff;
background : #3b5998;
}
.button.facebook img {
vertical-align : text-top;
}
.button.facebook:hover {
background : #5574cb;
}
.fb-like {
width : 40px;
position : relative;
}
Det er litt vanskelig å skrive om når man ikke har noe å teste med, så du får nesten bare prøve deg litt frem.
