Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 13 of 13
  1. #1
    Regular Coder
    Join Date
    Dec 2010
    Posts
    134
    Thanks
    17
    Thanked 6 Times in 6 Posts

    Minus Margin Issues

    FF is putting a line above one of my images. I don't know why.

    http://chewx.co.uk/NTU/claim/index.php

    Code:
        <article_prod class="shadow_sml">
    <?php query_posts('category_name=Product'); ?>
    
      <?php while (have_posts()) : the_post(); ?>
        	<div class="image">
    			<img src="<?php echo catch_that_image() ?>"/>
    		</div>
    		<div class="title_mid">
    		<div class="title_top"><img src="images/top_mid.png"/></div>
    		<div class="text">
    			<h3 class="posts"><?php the_title(); ?></h3>
    		</div>
    		<div class="title_bottom"><img src="images/bottom_mid.png"/></div>
    		</div>
    		<div class="read">
            	<div class="readme"><h3 class="reading"><a href="<?php the_permalink(); ?>">Read More..</a></h3></div>
    		</div>
    <?php endwhile; ?>
        </article_prod>
    Code:
    .image{
    	height:inherit;
    	z-index:1;
    }
    
    .image img{
    	width:300px;
    }
    
    .title{
    	height:inherit;
    	background-color:#66cccc;
    	z-index:500;
    }
    
    .title_mid{
    	height:auto;
    	background-color:#66ccff;
    	z-index:500;
    }
    
    .read{
    	height:60px;
    	background-color:#6699cc;
    	z-index:1;
    }
    
    .readme{
    	height:20px;
    	margin:20px;
    	background-color:#CCCCCC;
    	float:left;
    }
    
    .title_top{
    	margin-top:-17px;
    	height:7px;
    	z-index:500;
    }
    
    .title_bottom{
    	margin-bottom:-0px;
    	height:7px;
    	z-index:500;
    }
    
    .text{
    	text-align:justify;
    	padding:15px 15px 0px 15px;
    }

  • #2
    Master Coder Excavator's Avatar
    Join Date
    Dec 2006
    Location
    Alaska
    Posts
    9,671
    Thanks
    22
    Thanked 1,827 Times in 1,811 Posts
    Hello CHEWX,
    Any hints as to which image? The more specific you are the easier it is for someone to help you. Explain your problem as if you were talking to someone who is seeing your site for the first time.
    Validate often DURING development - Use it like a splelchecker | Debug during Development |Write it for FireFox, ignore IE
    Use the right DocType | Validate your markup | Validate your CSS | Why validating is good | Why tables are bad

  • Users who have thanked Excavator for this post:

    CHEWX (05-11-2011)

  • #3
    Regular Coder
    Join Date
    Dec 2010
    Posts
    134
    Thanks
    17
    Thanked 6 Times in 6 Posts
    Sorry, above the read me links.

    It's basically a jagged .png image. In safari and chrome it's fine. But in FF it does not sit flush with the above div.

    So .read is not sitting flush with .title_mid

    I think it's to do with the minus margins.

  • #4
    Senior Coder
    Join Date
    Aug 2010
    Location
    High Point, NC
    Posts
    3,332
    Thanks
    5
    Thanked 363 Times in 360 Posts
    It's quite a mess in IE as well. You have quite a few validation errors that should be fixed.

    I also hope you realize that html5 is still not fully supported by quite a few browsers still being used.
    Teed

  • #5
    Regular Coder
    Join Date
    Dec 2010
    Posts
    134
    Thanks
    17
    Thanked 6 Times in 6 Posts
    I don't have IE on this computer so have never viewed it in that. A separate stylesheet will accommodate that, but not until it's perfect on Safari, FF and Chrome.

    Validation I always do last (bad practise, I know). And that is something that isn't causing the errors.

    Tell me one thing that is supported in all browsers?

    ..That is a debate for another day. If no one coded in HTML5 then browsers will never progress.

    P.S, It's CSS3 too

  • #6
    Senior Coder
    Join Date
    Aug 2010
    Location
    High Point, NC
    Posts
    3,332
    Thanks
    5
    Thanked 363 Times in 360 Posts
    Tell me one thing that is supported in all browsers?
    A valid doctype...lol


    Well as someone who is coding a website for people other than yourself to view, the majority of which DO have IE, you should get it to test in..lol

    Validation SHOULD be done throughout designing and coding phase. If you think 59 validation errors have no bearing on how a browser renders your page currently, then not sure anyone can help you. You have multiple invalid comments in your code. I didnt look at the other errors, but one invalid comment is enough to screw up an entire website.

    Now, while yes we should all be working with html5, I only mentioned this because we as web designers cant afford to alienate the majority of users who may wait years to install the latest browser version.
    Last edited by teedoff; 05-12-2011 at 12:12 AM.
    Teed

  • #7
    Regular Coder
    Join Date
    Dec 2010
    Posts
    134
    Thanks
    17
    Thanked 6 Times in 6 Posts
    Quote Originally Posted by teedoff View Post
    Well as someone who is coding a website for people other than yourself to view, the majority of which DO have IE, you should get it to test in..lol

    I have a Mac..

    Don't worry I will help the inconsiderate twats that still use IE.

    But again, that is something I do at the end when I have access to a Windows computer. No point writing two stylesheets at the same time, that gets complicated. I write one then I amend it on a Windows computer for IE.


    Validation SHOULD be done throughout designing and coding phase. If you think 59 validation errors have no bearing on how a browser renders your page currently, then not sure anyone can help you. You have multiple invalid comments in your code. I didnt look at the other errors, but one invalid comment is enough to screw up an entire website.

    It should be done throughout, yes, like I said, bad practise. I'm 100% sure it isn't causing me issues with this though. Unless you can prove otherwise, hence the thread ?

    Now, while yes we should all be working with html5, I only mentioned this because we as web designers cant afford to alienate the majority of users who may wait years to install the latest browser version.

    So how do things progress ?

    I am a student at University, I've learnt XHTML and now I feel it apt to get ahead of the game with people like yourselves and code in HTML5 and CSS3, then when I come to graduate I'll be the applicant that has vast knowledge of HTML5 and CSS3 rather than Billy-Bob who has coded for 10 years in XHTML and knows nothing about these new languages that taketh the web forward.

    Good enough philosophy ?
    Replied in BOLD

  • #8
    Regular Coder
    Join Date
    Dec 2010
    Posts
    134
    Thanks
    17
    Thanked 6 Times in 6 Posts
    Rhetorical question.

  • #9
    Senior Coder
    Join Date
    Aug 2010
    Location
    High Point, NC
    Posts
    3,332
    Thanks
    5
    Thanked 363 Times in 360 Posts
    lol and a childish student at that

    You want me to fix the validation errors for you? I merely suggested you fix your coding errors, since as you put it, you want to be ahead of us billy bob coders stuck in ancient technologies.

    I also didnt suggest working with html5 was wrong, I merely was trying to be helpful in informing you that its still not fully released and supported.

    You can take help and advice from ppl here if you want. Had I see the issue you are talking about IN FF i would have offered some help specifically on your issue, but since your site is broken in FF as well, I cant do that either.

    And since you like proof, here is a screenshot of how I see your site in FF
    Attached Thumbnails Attached Thumbnails Minus Margin Issues-readmore.jpg  
    Teed

  • #10
    Regular Coder
    Join Date
    Dec 2010
    Posts
    134
    Thanks
    17
    Thanked 6 Times in 6 Posts
    Not biting back, I just have valid replies to your posts. So childish ? I beg to differ.

    No, I can fix the validation. I'll do that tomorrow and see if it helps. As it is a habit I need to get out of.

    Okay, "PissedOff", you think how many students leave University trying to get into the web industry. How many of those that have XHTML knowledge and someone how has XHTML and 5 years experience, will get jobs ? None.

    So I think my philosophy on getting ahead of the game is correct. Otherwise I'm throwing time and money away.

    Yes, I know it isn't fully released and supported.

    And I don't know how many times I need to hint/say I don't have a Windows computer. So FF will render different to FF on a Mac.

    I am sorry for this. But I have no other option to get it perfect on a Mac and THEN accommodate for different platforms/browsers.

  • #11
    Senior Coder
    Join Date
    Aug 2010
    Location
    High Point, NC
    Posts
    3,332
    Thanks
    5
    Thanked 363 Times in 360 Posts
    I wasn't debating your drive and desire to get ahead. I commend you for that. But remember, you came here and asked for help.

    ANd just to clear the record...I just graduated last spring as an older person yes, and am now working in the industry. So I know what it takes and where your at.

    Anyway, someone Im sure will help you. Good luck.
    Teed

  • #12
    Regular Coder
    Join Date
    Dec 2010
    Posts
    134
    Thanks
    17
    Thanked 6 Times in 6 Posts
    Thanks for the commendation.

    Just looked at the validation and it has nothing to do with the Mac FF error.

  • #13
    The Apostate Apostropartheid's Avatar
    Join Date
    Oct 2007
    Posts
    3,215
    Thanks
    16
    Thanked 265 Times in 263 Posts
    If you wish people to help you, I suggest you be less rude and aggressive.

    For information: HTML5 is not even a specification yet, and HTML 4.01 and XHTML 1.0 will be standards for many years to come. Any competent coder will need to be familiar with both languages. Having a Mac does not hinder you from using Windows, either. Macs are PCs.

    In addition: I use IE.

    Thread closed.

  • Users who have thanked Apostropartheid for this post:

    CHEWX (05-12-2011)


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •