How do i make my code works in other browser

HTML & CSS
1

Hi, Can i ask to you all sitepoint people or to all masters here,when you are making your design or layout for your website what will you do in order your codes works in any browser, do you all guys install all the browser
in your p.c like the firefox,opera ,I.E,safari,etc… and open the pages in every browser that you have design to see to it’s working?is this how you test your codes in any browser?..if not, please let me know because i am still beginner in making design and layout and i want to know how you test your codes that works in every browser.I hope you can share me your idea.Thank you in advance and more power to you always.

2

You only need to set rules to others browsers if you are using CSS3, because each browser have a different rendering processes.
So if u need CSS3 you need use that :

-webkit-rule:value; –> Safari and Chrome
-moz-rule:value; –> Mozilla Firefox
-o–rule:value; –> Opera

For olders IE versions you need use :
<!–[If IE 6]>
<link href=“css/*.css” rel=“stylesheet” type=“text/css”>
<!–[endif]–>

<!–[If IE 7]>
<link href=“css/*.css” rel=“stylesheet” type=“text/css”>
<!–[endif]–>

<!–[If IE 8]>
<link href=“css/*.css” rel=“stylesheet” type=“text/css”>
<!–[endif]–>

This is all I know, if you have more questions leave here :wink:
Good Lucky.

3

I tend to install as many browsers as I can and test the real thing. That’s the most reliable method. There are lots of ways to test, though. Here are some tips:

http://pageaffairs.com/web/design/browser-testing/

4

@Ralph @Thavo, Thank you for the reply…about those if statement how to put that in header section?..@Ralph what if the codes works in firefox and does not work in internet explorer 6-8,how can we trace this?

5

Thank you for this link,i will read this.and i will write back if there are things that i could not understand.

6

Just as you see them in Thavo’s post.

what if the codes works in firefox and does not work in internet explorer 6-8,how can we trace this?

The best way is to check them in those browsers—whether you use the actual browser or some kind of testing tool as listed in my link above.

7

Hi Ralph i tried now to test my code in I.E8 and i see there is a difference in firefox,firefox looks okay while the I.E8 does not,the border bottom has no color in I.E8 while the firefox has.

but this is only i know how to put color in my border.and i don’t know how to put border color in I.E8,how can i work this in I.E?



#top #active a {
    background-position: 0 0;
    border-bottom:solid 1px #DCDEE2;
	
}

This is what i put in my HTML,i put if statement but nothing happened.

<!DOCTYPE html>
<meta charset = “UTF-8” />

<head><title>First Page</title>

<!–[If IE 8]>
<link href=“css/tabs.css” rel=“stylesheet” type=“text/css”>
<![endif]–>

 &lt;link href="tabs.css" rel="stylesheet" style="text/css"/&gt;
  &lt;style type="text/css"&gt;
8

You don’t need conditional comments for basic things like colors. :slight_smile: If you do your CSS right, all browsers will understand your style sheet. Conditional comments are only for where IE is being a pain because it’s buggy.

9

Thank you ralph.