Skip to content

Instantly share code, notes, and snippets.

View Tiny-Giant's full-sized avatar

Tiny Giant Tiny-Giant

  • Ladysmith, BC, Canada
View GitHub Profile
<div class="product-thumbnail-container clr">
<div class="product-thumbnail-wrap">
<img data-big="<?php echo $url ?>" title="<?php the_field('colour'); ?>" tray="A.1.C" class="product-thumb product-thumb-active" src="<?php the_field('featured_image_a_thumbnail'); ?>" />
<div class="product-thumbnail-name"><?php the_field('colour'); ?></div>
</div>
<?php if(get_field('featured_image_b')) { ?>
<div class="product-thumbnail-wrap">
<img data-big="<?php the_field('featured_image_b'); ?>" tray="B.1.B" title="<?php the_field('featured_image_b_thumbnail_name'); ?>" class="product-thumb" src="<?php the_field('featured_image_b_thumbnail'); ?>" />
<div class="product-thumbnail-name"><?php the_field('featured_image_b_thumbnail_name'); ?></div>

In the following snippet, I want the icons to be displayed on either side of the text. As you can see, it isn't working very well. As well, everything below .container is loaded through a WordPress plugin, so it cannot be altered.

What am I doing wrong, and how can I display the icons on either side of the text?

<div class="container" style="width: 40%; margin: 0 auto;">
<a href="https://www.instagram.com/idleslidegloves/" style="float: left;"><img src="http://idleslidegloves.com/wp-content/uploads/2016/01/instagram-22.png" alt=""></a>
<a href="https://www.facebook.com/idleslidegloves/" style="float: right;"><img src="http://idleslidegloves.com/wp-content/uploads/2016/01/facebook-7-22.png" alt=""></a>
</div>
<h3>
    <a href="https://www.facebook.com/idleslidegloves/"><img src="http://idleslidegloves.com/wp-content/uploads/2016/01/facebook-7-22.png" alt=""></a>
    <a href="https://www.instagram.com/idleslidegloves/" style="float: right;"><img src="http://idleslidegloves.com/wp-content/uploads/2016/01/instagram-22.png" alt=""></a>
    Subscribe and we'll let you know when our website is up and running   
@Tiny-Giant
Tiny-Giant / OldSidebarWidth.user.js
Last active January 13, 2016 05:22
Returns the old sizing of the sidebar, make sure your adblocker is running.
// ==UserScript==
// @name Old Sidebar width
// @namespace http://github.com/TinyGiant/
// @description Returns the old sizing of the sidebar
// @author @TinyGiant
// @run-at document-start
// @version 1.0.0.5
// @include /^https?:\/\/(?!chat).*?(stackoverflow.com|stackexchange.com|superuser.com|serverfault.com|askubuntu.com|stackapps.com|mathoverflow.net)/.*$/
// ==/UserScript==
@Tiny-Giant
Tiny-Giant / HideJobs.user.js
Last active April 3, 2020 12:32
Hides references to Stack Overflow Jobs
// ==UserScript==
// @name Hide Jobs
// @namespace http://github.com/Tiny-Giant
// @version 1.0.0.1
// @description Hides references to Stack Overflow Jobs
// @author @TinyGiant
// @include /https?:\/\/(meta\.)?stackoverflow\.com/.*/
// @grant none
// ==/UserScript==
/* jshint -W097 */