Register

If this is your first visit, please click the Sign Up now button to begin the process of creating your account so you can begin posting on our forums! The Sign Up process will only take up about a minute of two of your time.

Results 1 to 2 of 2
  1. #1
    Junior Member
    Join Date
    Sep 2014
    Posts
    1
    Member #
    40090

    Question Chrome, IE, Firefox view result different

    Hello
    I need help with the code below.
    I always open chrome browser but recently, i got the 3rd image messed up.

    <section class="content items portfolio recent-works">
    <!-- item -->
    <article class="col-1-4">
    <h2><span class="color"><a href="ContestRules.html">2014 Music's Next GameChanger Contest</a></span></h2>
    <a href="ContestRules.html"> Click Here for More details...</a>
    <h2><span class="color">Let's Get Social</span></h2>
    <div>
    <!-- social icons -->
    <div class="social-icons"> <a href="https://www.facebook.com/pages/InsideTheDrop/274699575980181?fref=ts" class="social-icon facebook"></a> <a href="https://www.instagram.com/insidethedrop" class="social-icon instagram"></a> <a href="http://www.youtube.com/user/InsideTheDropTV" class="social-icon youtube"></a> <a href="https://www.pheed.com/insidethedrop#qp,all,all"><img src="img/Pheed.png" width="30" height="30"></a> <a href="https://twitter.com/insidethedrop" class="social-icon twitter"></a> </div>
    <!-- /social icons -->
    </div>
    </article>
    <!-- /item -->
    <!-- item -->
    <article class="col-1-4 clearfix"><a class="thumb-slide" href="ContestRules.html"><span class="thumbs-wrap"><img alt="pop-music-game-changer" src="img/content/ArianaGranderSiteChannel12-26-13.png" title="" /> <img alt="" src="img/content/ArianaGranderSiteChannelHover12-26-13.png" title="" /></span></a>
    <footer>
    <h2><a href="ContestRules.html">Pop Music Channel</a></h2>
    <div class="cat"><a href="ContestRules.html">Click Here </a></div>
    </footer>
    </article>
    <!-- /item -->
    <!-- item -->
    <article class="col-1-4"><a class="thumb-slide" href="ContestRules.html"><span class="thumbs-wrap"><img alt="rap-music-game-changer" src="img/content/DrakeSiteChannel12-26-13.png" title="" /> <img alt="" src="img/content/DrakeSiteChannelHover12-26-13.png" /></span></a>
    <footer>
    <h2><a href="ContestRules.html">Hip Hop Channel</a></h2>
    <div class="cat"><a href="ContestRules.html">Click Here</a></div>
    </footer>
    </article>
    <!-- /item -->
    <!-- item -->
    <article class="col-1-4"><a class="thumb-slide" href="ContestRules.html"><span class="thumbs-wrap"><img alt="electro-house-game-changer" src="img/content/3BallSiteChannel4-19-14.png" title="" /> <img alt="" src="img/content/3BallSiteChannelHover4-19-14.png" title="" /></span></a>
    <footer>
    <h2><a href="ContestRules.html">Latin Music Channel</a></h2>
    <div class="cat"><a href="ContestRules.html">Click Here</a></div>
    </footer>
    </article>
    <!-- <div class="info-box">
    <h2 class="text-center">The Winner of today's contest to win a free Johnny O Mini Cruiser is instagram follower @johnnyo_fan 05/04/2014</h2>
    </div> -->
    <!-- /item -->
    </section>
    errrrr.jpg

    On Internet Explore and firefox it is working correctly
    errrrr2.jpg

    Please help me.

  2.  

  3. #2
    Senior Member sasha_bolcina's Avatar
    Join Date
    Sep 2014
    Location
    Serbia
    Posts
    274
    Member #
    40099
    Liked
    47 times
    I don't know what you did in css, but it seams there is not enough space for chrome to display everything in one row. Chrome is setting its own values for not manually defined css properties.
    - fix the width of section (in pixels), try with different widths and test in chrome
    If this not help try:
    fix the width of article
    change padding and margin for article to see how it affects on layout in chrome

    EDIT:
    By using css reset, browser will not use its default css settings. So, set all margins and paddings for html, body, div, span, etc. to "0" before implementing your styles.
    Last edited by sasha_bolcina; Sep 09th, 2014 at 04:41 PM.


Remove Ads

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
All times are GMT -6. The time now is 06:53 AM.
Powered by vBulletin® Version 4.2.3
Copyright © 2019 vBulletin Solutions, Inc. All rights reserved.
vBulletin Skin By: PurevB.com