Title: Why does wordPress renders my CSS/HTML different
Last modified: August 19, 2016
---
# Why does wordPress renders my CSS/HTML different
* [fs_tigre](https://wordpress.org/support/users/fs_tigre/)
* (@fs_tigre)
* [15 years, 5 months ago](https://wordpress.org/support/topic/why-does-wordpress-renders-my-csshtml-different/)
* Hi,
* I’m currently trying to understand how wordPress themes work, last night I was
converting one of my designs into a theme and I noticed some margin/padding differences
in my theme vs my CSS/HTML design. When I view my theme it has a few spaces between
an image and a div the layout looks good except these spaces (which are nested
inside the main content, so it’s not breaking my layout). The reason I was surprised
is because I’m using the same CSS file, I just copied and pasted it.
* Does wordPress renders the pages in a certain way that it could affect the layout?
* Why does this look different than my original design?
* I know it’s hard to predict what’s wrong without looking at the code but I’m
not asking for help as to how to fix it (at least not at the moment) I just want
to know if this is something I should be aware of in wordPress or if you guy
have seen something like this before where your design doesn’t look the same
after converting it into a theme.
* Thanks a lot.
Viewing 5 replies - 1 through 5 (of 5 total)
* [Connor Montgomery](https://wordpress.org/support/users/c_t_montgomery/)
* (@c_t_montgomery)
* [15 years, 5 months ago](https://wordpress.org/support/topic/why-does-wordpress-renders-my-csshtml-different/#post-1777103)
* Are you utilizing a reset.css file? If so, you may not be referencing that correctly,
and that may be the issue…
* Thread Starter [fs_tigre](https://wordpress.org/support/users/fs_tigre/)
* (@fs_tigre)
* [15 years, 5 months ago](https://wordpress.org/support/topic/why-does-wordpress-renders-my-csshtml-different/#post-1777190)
* Well this is what I’m using as my reset…
* ```
body, html, div, blockquote, img, label, p, h1, h2, h3, h4, h5, h6, pre, ul, ol, li, dl, dt, dd, form, a, fieldset, input, th, td {
margin: 0;
padding: 0;
border: 0;
outline: none;
}
```
* Thanks a lot!
* [Connor Montgomery](https://wordpress.org/support/users/c_t_montgomery/)
* (@c_t_montgomery)
* [15 years, 5 months ago](https://wordpress.org/support/topic/why-does-wordpress-renders-my-csshtml-different/#post-1777214)
* Hmm. That should be ok. Do you have a link I could look at? I can just Firebug
the issue and let you know what’s going on! Post a link to the WP site and a
link to the static site, and explain the differences, and I can help you out!
* [signature removed]
* Thread Starter [fs_tigre](https://wordpress.org/support/users/fs_tigre/)
* (@fs_tigre)
* [15 years, 5 months ago](https://wordpress.org/support/topic/why-does-wordpress-renders-my-csshtml-different/#post-1777222)
* Wow! Thank you for the offer but I’m working locally.
* I found the problem, what I have is this… a div “page-wrap” holding all of my
content and inside this I have a little box on the side-bar (typical side boxes
like the ones used in this page) with an image as the header and a div with the
content for the little box the thing is that I’m applying a line-height: of 1.4
to my page-wrap and it’s affecting the spacing between my image (header) and
my div (content), I basically have a gap of 1.4 between the image and the div
that make the little box.
* CSS:
`#page-wrap{line-height:1.4}` HTML:
* ```
```
* I know its hard to predict something without looking at the code but what I don’t
know understand is why is the line-height affecting only the WordPress theme
and not the static page, in the static page I change the line-height and it doesn’t
affect my images at all and in my theme if I increase this to 1.9 or something
more than 1.4 it actually breaks my layout, and all I did is copied the css from
my static page to my theme, in fact I did this a few time thinking that I some
how minified my themes css but no, both files are identical.
* Do you think I’m not positioning my code in the right template and this is causing
confusion for WP?
* Oh, the only difference in my HTML code between my static and my wordpress theme
is the I’m using “” for each image used in
my theme, I don’t remember where I learn this from but I used this to make WP
recognize my images used in my HTML, perhaps I’m doing this wrong.
My HTML for
all images look something like this… `;?
>/images/image-name.jpg)
`
* Could this be the problem? If yes, is there an other way to make WP recognize
images used in the HTML file?
* Thanks a lot!
* Thread Starter [fs_tigre](https://wordpress.org/support/users/fs_tigre/)
* (@fs_tigre)
* [15 years, 5 months ago](https://wordpress.org/support/topic/why-does-wordpress-renders-my-csshtml-different/#post-1777240)
* Found the problem.
* I noticed that I was using different DOCTYPE between files.
XHTML 1.0 Strict
in my wordPress theme and XHTML 1.0 Transitional in my static page, I changed
the DOCTYPE and it did the trick.
* Thanks a lot.
Viewing 5 replies - 1 through 5 (of 5 total)
The topic ‘Why does wordPress renders my CSS/HTML different’ is closed to new replies.
* 5 replies
* 2 participants
* Last reply from: [fs_tigre](https://wordpress.org/support/users/fs_tigre/)
* Last activity: [15 years, 5 months ago](https://wordpress.org/support/topic/why-does-wordpress-renders-my-csshtml-different/#post-1777240)
* Status: not resolved
## Topics
### Topics with no replies
### Non-support topics
### Resolved topics
### Unresolved topics
### All topics
