Skip to content

Commit

Permalink
One more attempt to fix #19
Browse files Browse the repository at this point in the history 
Let's try with a simple spacing ( ) solution because hspace
solution and the needed tricks are not enough and produce reordering
issues.
This give us less control over the real pixels used for spacing, but
this is better than other issues.
  • Loading branch information
@bago
bago committed Oct 30, 2015
1 parent f145dfc commit c7ceff5
Showing 1 changed file with 36 additions and 41 deletions.
77 changes: 36 additions & 41 deletions templates/versafix-1/template-versafix-1.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -197,19 +197,14 @@
body { Margin: 0; padding: 0; }
img { border: 0px; display: block; }

.socialLinks { font-size: 0; }
.socialLinks { font-size: 6px; }
.socialLinks a {
font-size: 0;
display: inline-block;
}
.socialIcon {
float: none;
display: inline-block;
vertical-align: top;
padding-bottom: 0px;
Margin-left: 2px;
Margin-right: 2px;
*margin-left: -2px;
*margin-right: -2px;
border-radius: 100%;
}
.oldwebkit { max-width: 570px; }
Expand Down Expand Up @@ -1361,61 +1356,61 @@
<tr>
<td align="right" valign="middle" class="links-color socialLinks mobile-textcenter" data-ko-display="socialIconType eq 'colors'">
<a data-ko-display="fbVisible" href="" style="-ko-attr-href: @fbUrl">
<img align="right" src="img/social_def/facebook_ok.png" alt="Facebook" border="0" hspace="4" vspace="0" class="socialIcon" />
</a>
<img src="img/social_def/facebook_ok.png" alt="Facebook" border="0" class="socialIcon" />
</a><span data-ko-display="fbVisible" data-ko-wrap="false">&nbsp;</span>
<a data-ko-display="twVisible" href="" style="-ko-attr-href: @twUrl">
<img align="right" src="img/social_def/twitter_ok.png" alt="Twitter" border="0" hspace="4" vspace="0" class="socialIcon" />
</a>
<img src="img/social_def/twitter_ok.png" alt="Twitter" border="0" class="socialIcon" />
</a><span data-ko-display="twVisible" data-ko-wrap="false">&nbsp;</span>
<a data-ko-display="ggVisible" href="" style="-ko-attr-href: @ggUrl">
<img align="right" src="img/social_def/google+_ok.png" alt="Google+" border="0" hspace="4" vspace="0" class="socialIcon" />
</a>
<img src="img/social_def/google+_ok.png" alt="Google+" border="0" class="socialIcon" />
</a><span data-ko-display="ggVisible" data-ko-wrap="false">&nbsp;</span>
<a data-ko-display="webVisible" href="" style="-ko-attr-href: @webUrl; display: none">
<img align="right" src="img/social_def/web_ok.png" alt="Web" border="0" hspace="4" vspace="0" class="socialIcon" />
</a>
<img src="img/social_def/web_ok.png" alt="Web" border="0" class="socialIcon" />
</a><span data-ko-display="webVisible" data-ko-wrap="false">&nbsp;</span>
<a data-ko-display="inVisible" href="" style="-ko-attr-href: @inUrl; display: none">
<img align="right" src="img/social_def/linkedin_ok.png" alt="Linkedin" border="0" hspace="4" vspace="0" class="socialIcon" />
</a>
<img src="img/social_def/linkedin_ok.png" alt="Linkedin" border="0" class="socialIcon" />
</a><span data-ko-display="inVisible" data-ko-wrap="false">&nbsp;</span>
<a data-ko-display="flVisible" href="" style="-ko-attr-href: @flUrl; display: none">
<img align="right" src="img/social_def/flickr_ok.png" alt="Flickr" border="0" hspace="4" vspace="0" class="socialIcon" />
</a>
<img src="img/social_def/flickr_ok.png" alt="Flickr" border="0" class="socialIcon" />
</a><span data-ko-display="flVisible" data-ko-wrap="false">&nbsp;</span>
<a data-ko-display="viVisible" href="" style="-ko-attr-href: @viUrl; display: none">
<img align="right" src="img/social_def/vimeo_ok.png" alt="Vimeo" border="0" hspace="4" vspace="0" class="socialIcon" />
</a>
<img src="img/social_def/vimeo_ok.png" alt="Vimeo" border="0" class="socialIcon" />
</a><span data-ko-display="viVisible" data-ko-wrap="false">&nbsp;</span>
<a data-ko-display="instVisible" href="" style="-ko-attr-href: @instUrl; display: none">
<img align="right" src="img/social_def/instagram_ok.png" alt="Instagram" border="0" hspace="4" vspace="0" class="socialIcon" />
</a>
<img src="img/social_def/instagram_ok.png" alt="Instagram" border="0" class="socialIcon" />
</a><span data-ko-display="instVisible" data-ko-wrap="false">&nbsp;</span>
<a data-ko-display="youVisible" href="" style="-ko-attr-href: @youUrl; display: none">
<img align="right" src="img/social_def/youtube_ok.png" alt="Youtube" border="0" hspace="4" vspace="0" class="socialIcon" />
<img src="img/social_def/youtube_ok.png" alt="Youtube" border="0" class="socialIcon" />
</a>
</td>
<td align="right" valign="middle" class="links-color socialLinks mobile-textcenter" data-ko-display="socialIconType eq 'bw'"
style="display: none">
<a data-ko-display="fbVisible" href="" style="-ko-attr-href: @fbUrl">
<img align="right" src="img/social_def/facebook_bw_ok.png" alt="Facebook" border="0" hspace="4" vspace="0" class="socialIcon" />
</a>
<img src="img/social_def/facebook_bw_ok.png" alt="Facebook" border="0" class="socialIcon" />
</a><span data-ko-display="fbVisible" data-ko-wrap="false">&nbsp;</span>
<a data-ko-display="twVisible" href="" style="-ko-attr-href: @twUrl">
<img align="right" src="img/social_def/twitter_bw_ok.png" alt="Twitter" border="0" hspace="4" vspace="0" class="socialIcon" />
</a>
<img src="img/social_def/twitter_bw_ok.png" alt="Twitter" border="0" class="socialIcon" />
</a><span data-ko-display="twVisible" data-ko-wrap="false">&nbsp;</span>
<a data-ko-display="ggVisible" href="" style="-ko-attr-href: @ggUrl">
<img align="right" src="img/social_def/google+_bw_ok.png" alt="Google+" border="0" hspace="4" vspace="0" class="socialIcon" />
</a>
<img src="img/social_def/google+_bw_ok.png" alt="Google+" border="0" class="socialIcon" />
</a><span data-ko-display="ggVisible" data-ko-wrap="false">&nbsp;</span>
<a data-ko-display="webVisible" href="" style="-ko-attr-href: @webUrl; display: none">
<img align="right" src="img/social_def/web_bw_ok.png" alt="Web" border="0" hspace="4" vspace="0" class="socialIcon" />
</a>
<img src="img/social_def/web_bw_ok.png" alt="Web" border="0" class="socialIcon" />
</a><span data-ko-display="webVisible" data-ko-wrap="false">&nbsp;</span>
<a data-ko-display="inVisible" href="" style="-ko-attr-href: @inUrl; display: none">
<img align="right" src="img/social_def/linkedin_bw_ok.png" alt="Linkedin" border="0" hspace="4" vspace="0" class="socialIcon" />
</a>
<img src="img/social_def/linkedin_bw_ok.png" alt="Linkedin" border="0" class="socialIcon" />
</a><span data-ko-display="inVisible" data-ko-wrap="false">&nbsp;</span>
<a data-ko-display="flVisible" href="" style="-ko-attr-href: @flUrl; display: none">
<img align="right" src="img/social_def/flickr_bw_ok.png" alt="Flickr" border="0" hspace="4" vspace="0" class="socialIcon" />
</a>
<img src="img/social_def/flickr_bw_ok.png" alt="Flickr" border="0" class="socialIcon" />
</a><span data-ko-display="flVisible" data-ko-wrap="false">&nbsp;</span>
<a data-ko-display="viVisible" href="" style="-ko-attr-href: @viUrl; display: none">
<img align="right" src="img/social_def/vimeo_bw_ok.png" alt="Vimeo" border="0" hspace="4" vspace="0" class="socialIcon" />
</a>
<img src="img/social_def/vimeo_bw_ok.png" alt="Vimeo" border="0" class="socialIcon" />
</a><span data-ko-display="viVisible" data-ko-wrap="false">&nbsp;</span>
<a data-ko-display="instVisible" href="" style="-ko-attr-href: @instUrl; display: none">
<img align="right" src="img/social_def/instagram_bw_ok.png" alt="Instagram" border="0" hspace="4" vspace="0" class="socialIcon" />
</a>
<img src="img/social_def/instagram_bw_ok.png" alt="Instagram" border="0" class="socialIcon" />
</a><span data-ko-display="instVisible" data-ko-wrap="false">&nbsp;</span>
<a data-ko-display="youVisible" href="" style="-ko-attr-href: @youUrl; display: none">
<img align="right" src="img/social_def/youtube_bw_ok.png" alt="Youtube" border="0" hspace="4" vspace="0" class="socialIcon" />
<img src="img/social_def/youtube_bw_ok.png" alt="Youtube" border="0" class="socialIcon" />
</a>
</td>
</tr>
Expand Down

0 comments on commit c7ceff5

Please sign in to comment.