Forums

hrechkaness

I am having alignment issues between firefox and all other browsers(or vise versa). The alignment seems to be working as intended on my header but then when I check other browsers and the icons seem to be hanging down. I can go into the css and add margin-top: -70px; to the code but then the alignment will be funny in firefox. Is there something wrong with my code? I ask because I've been using the same principles with floats all across the site and am only having this issue with the header. Here is the website template: www.whinerbros.com (Please ignore text below, I didn't feel like using lorem ipsum)

dfogge

looks like you have a case of "div-itis"

try something more like

<div id="icons">                    
<div id="iconwrapper">

<a href="http://www.youtube.com/user/whinerbros?feature=results_main&quot; target="_blank"><img src="iconupdate/youtubeicon.png" alt="youtubeicon"></a>
                    
<a href="https://twitter.com/mitch_bit&quot; target="_blank"><img src="iconupdate/twittericon.png" alt="twittericon"></a>
                                
<a href="http://vimeo.com/user5899694&quot; target="_blank"><img src="iconupdate/vimeoicon.png" alt="vimeoicon"></a>
                           
<a href="http://hrechkaness.newgrounds.com/&quot; target="_blank"><img src="iconupdate/newgroundsicon.png" alt="newgroundsicon"></a>                                    

</div>
</div>

hrechkaness

Sure I can try that, but is there any way to specify the spacing between each icon? Or would they all be butted up together?

dfogge

yep, try something like:

#icons a {
	 padding-left: 9px;
}

hrechkaness

Thanks for your help, I will give that a try

hrechkaness

I can't thank you enough for the tips. Worked right away and it was such a simple fix. 5 Stars

dfogge

no trouble at all. glad i could help :)

treehouse : what would you like to learn today?

Forums

[Solved] Cross Browser Alignment issues using floats