JCKnoell Posted June 26, 2013 Share Posted June 26, 2013 I am trying to copy and paste code from our footer and place it into our header. We wanted to move the social media icons from the bottom to the top of the page, among other things. There are a lot of div tags and a few CSS class tags as well, in the footer. However, I copied only the link and imagde code into the header so that it doesn't try to link to class and css for the footer. My problem is that when I put the code into my header, it ends up bliowing up the first icon and discplacing everything else on the page (in fact, everything else is now missing completely. See the image I've uploaded.) I've tried resizing manuaaly using style="width:;height:;" and I've tried using the width and height within the img tag itself, but nothing is working. The website is www.cleantelligent.com. I can't find any styling within the header that would be affecting this either. We want the social media icons right under the "get started" button. Any thoughts would be very helpful. Thanks! Link to comment Share on other sites More sharing options...
MarkT Posted June 26, 2013 Share Posted June 26, 2013 Can you post your CSS/HTML code so I can take a look. Cheers Link to comment Share on other sites More sharing options...
thescientist Posted June 26, 2013 Share Posted June 26, 2013 (edited) images are inline elements, so height and width will not apply to them. you could give it display: inline-block style if you wanted, and then it would work Edited June 26, 2013 by thescientist Link to comment Share on other sites More sharing options...
JCKnoell Posted June 26, 2013 Author Share Posted June 26, 2013 @thescientist, can you be a littlre more specific? How would I go about doing that? Is it to clear the formatting from the CSS? or do I put that into the CSS, and if so, would that not ruin the rest of my site? @MarkT, what code would you like me to post? The code I'm trying to copy/paste? The footer? the header? You can access it all from cleantelligent.com. Link to comment Share on other sites More sharing options...
newseed Posted June 26, 2013 Share Posted June 26, 2013 If you are just simply copying the icon links and images and placing it within the header class called header_img then it going to blow out your icons because the css there is set for 200px wide. You just can't move something over and expect to work. You need to determine what you are moving and where going to be place keeping in mind that the header is going to have an affect on those icons. I would wrap a div around the social stuff and apply any styles to it to make it work without interfering with the other stuff in the header. <div class="header_social_icons"><a target="_blank" href="http://www.facebook.com/CleanTelligent"><img src="/wp-content/themes/cleantelligent/images/facebook.png"></a><a target="_blank" href="http://www.linkedin.com/company/cleantelligent_software"><img src="/wp-content/themes/cleantelligent/images/linkedin.png"></a><a target="_blank" href="https://twitter.com/#!/CleanTelligent1"><img src="/wp-content/themes/cleantelligent/images/twitter.png"></a><a href="/news-and-events/rss.xml"><img src="/wp-content/uploads/2012/05/Blog-button.png"></a></div> Link to comment Share on other sites More sharing options...
JCKnoell Posted June 26, 2013 Author Share Posted June 26, 2013 Thanks for all your help, guys. It seems that in the midst of me asking my question, we changed directions... This thread can be closed or deleted (I can't figure out how...) and I've reposted a more specific question in a new thread. Thanks! Link to comment Share on other sites More sharing options...
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment
Create an account
Sign up for a new account in our community. It's easy!
Register a new accountSign in
Already have an account? Sign in here.
Sign In Now