CSS<\/strong> files in separate folders.<\/p>\nThe most noteworthy part is that an individual has to reset padding as well as margin in order to get complete control over their layout. In this way, a person can get rid of the unwanted interference of automatic margins and paddings. So, attach another CSS file named reset.css for the same, which is easily available at Google, or copy the below-mentioned code in the CSS files.<\/p>\n
ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,body,html,p,blockquote,fieldset,input{<\/p>\n
margin:0;<\/p>\n
padding:0;<\/p>\n
}<\/p>\n
ul{<\/p>\n
list-style:none;<\/p>\n
}<\/p>\n
fieldset{<\/p>\n
border:0;<\/p>\n
}<\/p>\n
<\/p>\n
An individual has to link the CSS Stylesheet with their HTML document. Most of the time, popular web browsers, Internet Explorer 6 & 7, tend to mess up, and therefore, a person should always create a separate style sheet for each in order to sort out the incurred problems.<\/p>\n
Create a new folder, which should be named \u201cImages<\/strong>.\u201d In this folder, a person has to place all their pictures. Since all the base files are completed, it’s time to open the PSD file now.\u00a0 Open the PSD file and then hide almost every layer instead of the background layer. An individual can make as many backgrounds as he wishes. Since these slices will be optimized for quality and therefore, an individual can cut down the size of the image but not the quality. Now, people have to implement slices in CSS.<\/p>\nbody{<\/p>\n
background:#000 url(..\/images\/body_bg.jpg) center top no-repeat;<\/p>\n
color:#000;<\/p>\n
font:62.5% Helvetica,Arial,sans-serif;<\/p>\n
line-height:16px;<\/p>\n
}<\/p>\n
Now, an individual needs to calculate the wrapper area. Suppose a person has to divide the wrapper area of 847px in width, then it should be divisible by two so that it can align in the center. After finishing up the wrapper area, the next thing that comes is Padding. If a person wants to give padding of 1px from right or left to his wrapper div, then the wrapper area should have 848px width in effect. Apart from the wrapper area and padding, an individual needs to make a header area. For making a header area, one has to calculate the area from the top of the screen to the bottom of the navigation. Suppose a person has to calculate 138px in height, but the navigation and logo are placed below the top. In that case, an individual should use top padding – 104px in height.<\/p>\n
#header{<\/p>\n
width: 847px;<\/p>\n
padding: 0px\u00a0 0px\u00a0 0px\u00a0 0px;<\/p>\n
}<\/p>\n
Now, its time to slice up the logo and navigation background. An individual can use the sliding door technique by Douglas Bowman<\/strong> for the purpose of slicing the navigation background. The most noteworthy thing is that this technique of slicing navigation background should be used only if the navigation is text. There are some buttons that consist of long words and small words too. In other words, a person doesn\u2019t want each button with an equivalent background to their text. Therefore, one requires slicing the navigation background in order to cover all of the words.<\/p>\nFor example:<\/strong> An individual has \u201cphoto retouch\u201d (long word)\u00a0 and \u201chome\u201d (small word). Now, he wants to rename \u201cphoto retouch\u201d to \u201cperfect photo retouch\u201d. In that case, he would need to slice the navigation background again.<\/p>\nNow, a person has to create an ID named logo and write the following style.\u00a0The reason behind doing the same is not just to place the logo as an image and make it link, but to show it as text for\u00a0SEO<\/strong> purposes.<\/span>\u00a0Implement the same in HTML.<\/p>\n#logo{<\/p>\n
display: block;<\/p>\n
width: 90px;<\/p>\n
height: 18px;<\/p>\n
float: left;<\/p>\n
margin: 10px 0px 0px 0px;<\/p>\n
background: url(..\/images\/logo.jpg) no-repeat;<\/p>\n
text-indent: -999999px;<\/p>\n
}<\/p>\n
One can display <a><\/a> as a block within ul li and within that <a><\/a> . Besides that, a person need to display <span><\/span> as a block. The left slice of navigation will be applied to tag \u201c<a>\u201d which remain left aligned with no repetition. On the other hand, right slice applied to \u201c<span>\u201d means it will be left aligned and repeat horizontally. But, a person should never forget to use padding from top-left as well as right in order to get right adjustment alike PSD.\u00a0 In CSS, this will take place in below manner mentioned:<\/p>\n
#header ul{<\/p>\n
float: right;<\/p>\n
}<\/p>\n
#header ul li{<\/p>\n
float: left;<\/p>\n
height: 33px;<\/p>\n
margin: 0px\u00a0 0px\u00a0 0px\u00a0 16px;<\/p>\n
}<\/p>\n
#header ul li a{<\/p>\n
display:block;<\/p>\n
height: 33px;<\/p>\n
padding: 0px 0px 0px 2px;<\/p>\n
}<\/p>\n
#header ul li a span{<\/p>\n
display: inline-block;<\/p>\n
height: 23px;<\/p>\n
font-size: 13px;<\/p>\n
color: #fff;<\/p>\n
padding: 10px 6px 0px 6px;<\/p>\n
}<\/p>\n
#header ul li.active a{<\/p>\n
background: url(..\/images\/left_door.jpg) no-repeat left;<\/p>\n
}<\/p>\n
#header ul li.active a span{<\/p>\n
background: url(..\/images\/right_door.jpg) repeat-x right;<\/p>\n
}<\/p>\n
#header ul li a:hover{<\/p>\n
text-decoration: none;<\/p>\n
background: url(..\/images\/left_door.jpg) no-repeat left;<\/p>\n
}<\/p>\n
#header ul li a:hover span{<\/p>\n
text-decoration: none;<\/p>\n
background: url(..\/images\/right_door.jpg) repeat-x right;<\/p>\n
}<\/p>\n
(Note:<\/strong> Here, the class has been named \u201cactive\u201d for active state.)<\/strong><\/p>\nThis is how your (X) HTML coding will look alike after inserting above codes. Now, an individual need to slice the hover designs for the purpose of navigation buttons. One has to make single image of hover design and then, create normal state button. After that, a person has to implement all these buttons in CSS:<\/p>\n
a#left_button{<\/p>\n
display: block;<\/p>\n
width: 34px;<\/p>\n
height: 84px;<\/p>\n
float: left;<\/p>\n
margin: 149px 0px 0px 0px;<\/p>\n
background: url(..\/images\/left_arrow.jpg) no-repeat;<\/p>\n
text-indent: -9999px;<\/p>\n
}<\/p>\n
a:hover#left_button{<\/p>\n
background-position: 0px -84px;<\/p>\n
}<\/p>\n
a.active#left_button{<\/p>\n
background-position: 0px -84px;<\/p>\n
}<\/p>\n
a#right_button{<\/p>\n
display: block;<\/p>\n
width: 34px;<\/p>\n
height: 84px;<\/p>\n
float: left;<\/p>\n
margin: 149px 0px 0px 0px;<\/p>\n
background: url(..\/images\/right_arrow.jpg) no-repeat;<\/p>\n
text-indent: -9999px;<\/p>\n
}<\/p>\n
a:hover#right_button{<\/p>\n
background-position: 0px -84px;<\/p>\n
}<\/p>\n
a.active#right_button{<\/p>\n
background-position: 0px -84px;<\/p>\n
}<\/p>\n
Suppose, a person have almost six thumbnails in his content. In order to slice all six thumbnails one need\u00a0 <ul><li>. Besides that, simply take measurements from both sides and find out margins of each box between each other. Now, an individual need to write styles for them in CSS. Follow below mentioned codes.<\/p>\n
ul.gallery{<\/p>\n
width: 779px;<\/p>\n
float: left;<\/p>\n
}<\/p>\n
ul.gallery li{<\/p>\n
display: inline;<\/p>\n
width: 224px;<\/p>\n
height: 179px;<\/p>\n
float: left;<\/p>\n
margin: 0px 17px 30px 17px;<\/p>\n
}<\/p>\n
ul.gallery li a{<\/p>\n
display: block;<\/p>\n
width: 222px;<\/p>\n
height: 177px;<\/p>\n
border: 1px solid #cccccc;<\/p>\n
}<\/p>\n
ul.gallery li a:hover{<\/p>\n
border: 1px solid #fff;<\/p>\n
}In the end, this is how the HTML will look alike:<\/strong><\/p>\n<!DOCTYPE html PUBLIC “-\/\/W3C\/\/DTD XHTML 1.0 Strict\/\/EN”<\/strong><\/p>\n“http:\/\/www.w3.org\/TR\/xhtml1\/DTD\/xhtml1-strict.dtd”><\/strong><\/p>\n <\/p>\n
<html xmlns=”http:\/\/www.w3.org\/1999\/xhtml” xml:lang=”en” lang=”en”><\/strong><\/p>\n <\/p>\n
<head><\/strong><\/p>\n <title>PSD to XHTML\/CSS<\/title><\/strong><\/p>\n <link href=”css\/style.css” rel=”stylesheet” type=”text\/css” media=”all” \/><\/strong><\/p>\n <\/head><\/strong><\/p>\n <body><\/strong><\/p>\n <div><\/strong><\/p>\n <\/p>\n
<div><\/strong><\/p>\n <\/div><\/strong><\/p>\n <\/p>\n
<div><\/strong><\/p>\n <\/p>\n
<div><\/strong><\/p>\n <ul><\/strong><\/p>\n <li><a href=”#” id=”current”>Home<\/a><\/li><\/strong><\/p>\n <li><a href=”#”>About<\/a><\/li><\/strong><\/p>\n <li><a href=”#”>Portfolio<\/a><\/li><\/strong><\/p>\n <li><a href=”#”>Blog<\/a><\/li><\/strong><\/p>\n <li><a href=”#”>Contact Us<\/a><\/li><\/strong><\/p>\n <\/ul><\/strong><\/p>\n <\/div><\/strong><\/p>\n <\/p>\n
<div><\/strong><\/p>\n <div><\/strong><\/p>\n <img src=”img\/landscape.jpg” alt=”landscape” \/><\/strong><\/p>\n <\/div><\/strong><\/p>\n <div><p><\/p><\/strong><\/p>\n <\/div><\/strong><\/p>\n <\/p>\n
<div><\/strong><\/p>\n <p><\/p><\/strong><\/p>\n <\/p>\n
<p><\/p><\/strong><\/p>\n <\/p>\n
<p><\/p><\/strong><\/p>\n <\/p>\n
<p>Made by WebDesignerHelp<\/p><\/strong><\/p>\n <\/div><\/strong><\/p>\n <\/p>\n
<\/div> <\/strong><\/p>\n <\/div> <\/strong><\/p>\n <\/div><\/strong><\/p>\n <\/body><\/strong><\/p>\n <\/p>\n
<\/html><\/strong><\/p>\nNow, the overall concept of PSD to (X) HTML conversion is complete in terms of (X) HTML and CSS coding.\u00a0 By simply following above mentioned steps a person can easily convert his PSD based file in to XHTML format without any hassle.<\/p>\n
Posted By:<\/strong> CSSChopper Team<\/p>\n
First of all, in order to convert\u00a0PSD to XHTML code to get the best cross-browser compatibility, an individual needs to create an HTML file by using Macromedia Dreamweaver (a web development application), select XHTML 1.0 Strict.dtd from the .doc type option, and now, save XHTML 1.0 Strict.dtd as index.html. Now, an individual needs to create […]<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":[],"categories":[282],"tags":[],"acf":[],"yoast_head":"\n
PSD to XHTML cross browser compatibility<\/title>\n<meta name=\"description\" content=\"To achieve the best cross-browser compatibility when converting PSD to XHTML code, an individual needs to create an HTML file. Read the blog.\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/www.csschopper.com\/blog\/how-to-do-xhtml-code-from-psd-for-best-cross-browser-compatibility\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"PSD to XHTML cross browser compatibility\" \/>\n<meta property=\"og:description\" content=\"To achieve the best cross-browser compatibility when converting PSD to XHTML code, an individual needs to create an HTML file. Read the blog.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/www.csschopper.com\/blog\/how-to-do-xhtml-code-from-psd-for-best-cross-browser-compatibility\/\" \/>\n<meta property=\"og:site_name\" content=\"CSSChopper\" \/>\n<meta property=\"article:publisher\" content=\"https:\/\/www.facebook.com\/CSSChopperOfficial\/\" \/>\n<meta property=\"article:published_time\" content=\"2010-08-09T11:21:38+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2025-04-22T11:40:21+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/www.csschopper.com\/blog\/wp-content\/uploads\/2010\/08\/PSD-to-XHTML-cross-browser-compatibility.png\" \/>\n<meta name=\"twitter:card\" content=\"summary\" \/>\n<meta name=\"twitter:creator\" content=\"@csschopper\" \/>\n<meta name=\"twitter:site\" content=\"@csschopper\" \/>\n<meta name=\"twitter:label1\" content=\"Written by\" \/>\n\t<meta name=\"twitter:data1\" content=\"admin\" \/>\n\t<meta name=\"twitter:label2\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data2\" content=\"6 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"Organization\",\"@id\":\"https:\/\/www.csschopper.com\/blog\/#organization\",\"name\":\"CSSChopper - Your Trusted Technology Partner\",\"url\":\"https:\/\/www.csschopper.com\/blog\/\",\"sameAs\":[\"https:\/\/www.linkedin.com\/company\/csschopper\/\",\"https:\/\/www.designrush.com\/agency\/profile\/csschopper\",\"https:\/\/www.goodfirms.co\/companies\/view\/1856\/csschopper\",\"https:\/\/clutch.co\/profile\/csschopper\",\"https:\/\/www.facebook.com\/CSSChopperOfficial\/\",\"https:\/\/twitter.com\/csschopper\"],\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/www.csschopper.com\/blog\/#\/schema\/logo\/image\/\",\"url\":\"https:\/\/www.csschopper.com\/blog\/wp-content\/uploads\/2020\/05\/logo.jpg\",\"contentUrl\":\"https:\/\/www.csschopper.com\/blog\/wp-content\/uploads\/2020\/05\/logo.jpg\",\"width\":800,\"height\":500,\"caption\":\"CSSChopper - Your Trusted Technology Partner\"},\"image\":{\"@id\":\"https:\/\/www.csschopper.com\/blog\/#\/schema\/logo\/image\/\"}},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/www.csschopper.com\/blog\/#website\",\"url\":\"https:\/\/www.csschopper.com\/blog\/\",\"name\":\"CSSChopper\",\"description\":\"Know More About Us-News & Blog\",\"publisher\":{\"@id\":\"https:\/\/www.csschopper.com\/blog\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/www.csschopper.com\/blog\/?s={search_term_string}\"},\"query-input\":\"required name=search_term_string\"}],\"inLanguage\":\"en-US\"},{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/www.csschopper.com\/blog\/how-to-do-xhtml-code-from-psd-for-best-cross-browser-compatibility\/#primaryimage\",\"url\":\"https:\/\/www.csschopper.com\/blog\/wp-content\/uploads\/2010\/08\/PSD-to-XHTML-cross-browser-compatibility.png\",\"contentUrl\":\"https:\/\/www.csschopper.com\/blog\/wp-content\/uploads\/2010\/08\/PSD-to-XHTML-cross-browser-compatibility.png\",\"width\":\"406\",\"height\":\"420\",\"caption\":\"PSD to XHTML cross browser compatibility\"},{\"@type\":\"WebPage\",\"@id\":\"https:\/\/www.csschopper.com\/blog\/how-to-do-xhtml-code-from-psd-for-best-cross-browser-compatibility\/#webpage\",\"url\":\"https:\/\/www.csschopper.com\/blog\/how-to-do-xhtml-code-from-psd-for-best-cross-browser-compatibility\/\",\"name\":\"PSD to XHTML cross browser compatibility\",\"isPartOf\":{\"@id\":\"https:\/\/www.csschopper.com\/blog\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\/\/www.csschopper.com\/blog\/how-to-do-xhtml-code-from-psd-for-best-cross-browser-compatibility\/#primaryimage\"},\"datePublished\":\"2010-08-09T11:21:38+00:00\",\"dateModified\":\"2025-04-22T11:40:21+00:00\",\"description\":\"To achieve the best cross-browser compatibility when converting PSD to XHTML code, an individual needs to create an HTML file. Read the blog.\",\"breadcrumb\":{\"@id\":\"https:\/\/www.csschopper.com\/blog\/how-to-do-xhtml-code-from-psd-for-best-cross-browser-compatibility\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/www.csschopper.com\/blog\/how-to-do-xhtml-code-from-psd-for-best-cross-browser-compatibility\/\"]}]},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/www.csschopper.com\/blog\/how-to-do-xhtml-code-from-psd-for-best-cross-browser-compatibility\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\/\/www.csschopper.com\/blog\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"How to do XHTML code from PSD for best cross browser compatibility\"}]},{\"@type\":\"Article\",\"@id\":\"https:\/\/www.csschopper.com\/blog\/how-to-do-xhtml-code-from-psd-for-best-cross-browser-compatibility\/#article\",\"isPartOf\":{\"@id\":\"https:\/\/www.csschopper.com\/blog\/how-to-do-xhtml-code-from-psd-for-best-cross-browser-compatibility\/#webpage\"},\"author\":{\"@id\":\"https:\/\/www.csschopper.com\/blog\/#\/schema\/person\/3b4c4a923092f39700ebd52b6df7a1de\"},\"headline\":\"How to do XHTML code from PSD for best cross browser compatibility\",\"datePublished\":\"2010-08-09T11:21:38+00:00\",\"dateModified\":\"2025-04-22T11:40:21+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\/\/www.csschopper.com\/blog\/how-to-do-xhtml-code-from-psd-for-best-cross-browser-compatibility\/#webpage\"},\"wordCount\":1483,\"commentCount\":0,\"publisher\":{\"@id\":\"https:\/\/www.csschopper.com\/blog\/#organization\"},\"image\":{\"@id\":\"https:\/\/www.csschopper.com\/blog\/how-to-do-xhtml-code-from-psd-for-best-cross-browser-compatibility\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/www.csschopper.com\/blog\/wp-content\/uploads\/2010\/08\/PSD-to-XHTML-cross-browser-compatibility.png\",\"articleSection\":[\"Conversion Services\"],\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"CommentAction\",\"name\":\"Comment\",\"target\":[\"https:\/\/www.csschopper.com\/blog\/how-to-do-xhtml-code-from-psd-for-best-cross-browser-compatibility\/#respond\"]}]},{\"@type\":\"Person\",\"@id\":\"https:\/\/www.csschopper.com\/blog\/#\/schema\/person\/3b4c4a923092f39700ebd52b6df7a1de\",\"name\":\"admin\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/www.csschopper.com\/blog\/#\/schema\/person\/image\/\",\"url\":\"https:\/\/secure.gravatar.com\/avatar\/976880d3a3333e3c487a76cfba771509?s=96&r=g\",\"contentUrl\":\"https:\/\/secure.gravatar.com\/avatar\/976880d3a3333e3c487a76cfba771509?s=96&r=g\",\"caption\":\"admin\"},\"url\":\"https:\/\/www.csschopper.com\/blog\/author\/vikash\/\"}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"PSD to XHTML cross browser compatibility","description":"To achieve the best cross-browser compatibility when converting PSD to XHTML code, an individual needs to create an HTML file. Read the blog.","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/www.csschopper.com\/blog\/how-to-do-xhtml-code-from-psd-for-best-cross-browser-compatibility\/","og_locale":"en_US","og_type":"article","og_title":"PSD to XHTML cross browser compatibility","og_description":"To achieve the best cross-browser compatibility when converting PSD to XHTML code, an individual needs to create an HTML file. Read the blog.","og_url":"https:\/\/www.csschopper.com\/blog\/how-to-do-xhtml-code-from-psd-for-best-cross-browser-compatibility\/","og_site_name":"CSSChopper","article_publisher":"https:\/\/www.facebook.com\/CSSChopperOfficial\/","article_published_time":"2010-08-09T11:21:38+00:00","article_modified_time":"2025-04-22T11:40:21+00:00","og_image":[{"url":"https:\/\/www.csschopper.com\/blog\/wp-content\/uploads\/2010\/08\/PSD-to-XHTML-cross-browser-compatibility.png"}],"twitter_card":"summary","twitter_creator":"@csschopper","twitter_site":"@csschopper","twitter_misc":{"Written by":"admin","Est. reading time":"6 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Organization","@id":"https:\/\/www.csschopper.com\/blog\/#organization","name":"CSSChopper - Your Trusted Technology Partner","url":"https:\/\/www.csschopper.com\/blog\/","sameAs":["https:\/\/www.linkedin.com\/company\/csschopper\/","https:\/\/www.designrush.com\/agency\/profile\/csschopper","https:\/\/www.goodfirms.co\/companies\/view\/1856\/csschopper","https:\/\/clutch.co\/profile\/csschopper","https:\/\/www.facebook.com\/CSSChopperOfficial\/","https:\/\/twitter.com\/csschopper"],"logo":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www.csschopper.com\/blog\/#\/schema\/logo\/image\/","url":"https:\/\/www.csschopper.com\/blog\/wp-content\/uploads\/2020\/05\/logo.jpg","contentUrl":"https:\/\/www.csschopper.com\/blog\/wp-content\/uploads\/2020\/05\/logo.jpg","width":800,"height":500,"caption":"CSSChopper - Your Trusted Technology Partner"},"image":{"@id":"https:\/\/www.csschopper.com\/blog\/#\/schema\/logo\/image\/"}},{"@type":"WebSite","@id":"https:\/\/www.csschopper.com\/blog\/#website","url":"https:\/\/www.csschopper.com\/blog\/","name":"CSSChopper","description":"Know More About Us-News & Blog","publisher":{"@id":"https:\/\/www.csschopper.com\/blog\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/www.csschopper.com\/blog\/?s={search_term_string}"},"query-input":"required name=search_term_string"}],"inLanguage":"en-US"},{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www.csschopper.com\/blog\/how-to-do-xhtml-code-from-psd-for-best-cross-browser-compatibility\/#primaryimage","url":"https:\/\/www.csschopper.com\/blog\/wp-content\/uploads\/2010\/08\/PSD-to-XHTML-cross-browser-compatibility.png","contentUrl":"https:\/\/www.csschopper.com\/blog\/wp-content\/uploads\/2010\/08\/PSD-to-XHTML-cross-browser-compatibility.png","width":"406","height":"420","caption":"PSD to XHTML cross browser compatibility"},{"@type":"WebPage","@id":"https:\/\/www.csschopper.com\/blog\/how-to-do-xhtml-code-from-psd-for-best-cross-browser-compatibility\/#webpage","url":"https:\/\/www.csschopper.com\/blog\/how-to-do-xhtml-code-from-psd-for-best-cross-browser-compatibility\/","name":"PSD to XHTML cross browser compatibility","isPartOf":{"@id":"https:\/\/www.csschopper.com\/blog\/#website"},"primaryImageOfPage":{"@id":"https:\/\/www.csschopper.com\/blog\/how-to-do-xhtml-code-from-psd-for-best-cross-browser-compatibility\/#primaryimage"},"datePublished":"2010-08-09T11:21:38+00:00","dateModified":"2025-04-22T11:40:21+00:00","description":"To achieve the best cross-browser compatibility when converting PSD to XHTML code, an individual needs to create an HTML file. Read the blog.","breadcrumb":{"@id":"https:\/\/www.csschopper.com\/blog\/how-to-do-xhtml-code-from-psd-for-best-cross-browser-compatibility\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/www.csschopper.com\/blog\/how-to-do-xhtml-code-from-psd-for-best-cross-browser-compatibility\/"]}]},{"@type":"BreadcrumbList","@id":"https:\/\/www.csschopper.com\/blog\/how-to-do-xhtml-code-from-psd-for-best-cross-browser-compatibility\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/www.csschopper.com\/blog\/"},{"@type":"ListItem","position":2,"name":"How to do XHTML code from PSD for best cross browser compatibility"}]},{"@type":"Article","@id":"https:\/\/www.csschopper.com\/blog\/how-to-do-xhtml-code-from-psd-for-best-cross-browser-compatibility\/#article","isPartOf":{"@id":"https:\/\/www.csschopper.com\/blog\/how-to-do-xhtml-code-from-psd-for-best-cross-browser-compatibility\/#webpage"},"author":{"@id":"https:\/\/www.csschopper.com\/blog\/#\/schema\/person\/3b4c4a923092f39700ebd52b6df7a1de"},"headline":"How to do XHTML code from PSD for best cross browser compatibility","datePublished":"2010-08-09T11:21:38+00:00","dateModified":"2025-04-22T11:40:21+00:00","mainEntityOfPage":{"@id":"https:\/\/www.csschopper.com\/blog\/how-to-do-xhtml-code-from-psd-for-best-cross-browser-compatibility\/#webpage"},"wordCount":1483,"commentCount":0,"publisher":{"@id":"https:\/\/www.csschopper.com\/blog\/#organization"},"image":{"@id":"https:\/\/www.csschopper.com\/blog\/how-to-do-xhtml-code-from-psd-for-best-cross-browser-compatibility\/#primaryimage"},"thumbnailUrl":"https:\/\/www.csschopper.com\/blog\/wp-content\/uploads\/2010\/08\/PSD-to-XHTML-cross-browser-compatibility.png","articleSection":["Conversion Services"],"inLanguage":"en-US","potentialAction":[{"@type":"CommentAction","name":"Comment","target":["https:\/\/www.csschopper.com\/blog\/how-to-do-xhtml-code-from-psd-for-best-cross-browser-compatibility\/#respond"]}]},{"@type":"Person","@id":"https:\/\/www.csschopper.com\/blog\/#\/schema\/person\/3b4c4a923092f39700ebd52b6df7a1de","name":"admin","image":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www.csschopper.com\/blog\/#\/schema\/person\/image\/","url":"https:\/\/secure.gravatar.com\/avatar\/976880d3a3333e3c487a76cfba771509?s=96&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/976880d3a3333e3c487a76cfba771509?s=96&r=g","caption":"admin"},"url":"https:\/\/www.csschopper.com\/blog\/author\/vikash\/"}]}},"_links":{"self":[{"href":"https:\/\/www.csschopper.com\/blog\/wp-json\/wp\/v2\/posts\/156"}],"collection":[{"href":"https:\/\/www.csschopper.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.csschopper.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.csschopper.com\/blog\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.csschopper.com\/blog\/wp-json\/wp\/v2\/comments?post=156"}],"version-history":[{"count":13,"href":"https:\/\/www.csschopper.com\/blog\/wp-json\/wp\/v2\/posts\/156\/revisions"}],"predecessor-version":[{"id":15781,"href":"https:\/\/www.csschopper.com\/blog\/wp-json\/wp\/v2\/posts\/156\/revisions\/15781"}],"wp:attachment":[{"href":"https:\/\/www.csschopper.com\/blog\/wp-json\/wp\/v2\/media?parent=156"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.csschopper.com\/blog\/wp-json\/wp\/v2\/categories?post=156"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.csschopper.com\/blog\/wp-json\/wp\/v2\/tags?post=156"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}
![\"PSD](\"https:\/\/www.csschopper.com\/blog\/wp-content\/uploads\/2010\/08\/PSD-to-XHTML-cross-browser-compatibility.png\" "\\"PSD")
<\/p>\n