Apache Friends Support Forum

I'm using xampp to test my scripts in windows. I noticed that when I open scripts via localhost chrome doesn't show the size of elements correctly.

This is example

Code: Select all

<div style="width:270px; background:red">text</div>

When I screenshot it, size in photoshop is 244px. It is working when I put it online, it works when I open it like html file and it works in other browsers via localhost.

How a browser renders a web page is fully in control of the browser so it cannot be an xampp issue.

Weird thing it happens only for localhost

I am having the exact same problem. Here is what I am getting;

Internet Explorer 11
Open file:///C:/xampp/htdocs/Freetechtorials/index.html - looks fine
Open http://localhost/Freetechtorials/ - looks fine

Firefox 28.0
Open file:///C:/xampp/htdocs/Freetechtorials/index.html - looks fine
Open http://localhost/Freetechtorials/ - looks fine

Chrome 34.0.1847.116
Open file:///C:/xampp/htdocs/Freetechtorials/index.html - looks fine
Open http://localhost/Freetechtorials/ - one div is moved one the page and affects a few other elements

Any help on this would be greatly appreciated. I know that the way something displays in the browser is normally a browser or css issue, but it only happens when ran through XAMPP. Thanks

I fixed it. Just in case anyone else runs across this. There was an incorrectly closed anchor tag in a div and for some reason that was causing this issue. Fixing the element tags solved the problem. Just a heads up. If you download code from google to add a google+ link to your site watch for their tags as they added a </a> tag at the end that was not necessary. Thanks

Checking for valid HTML code is always a recommend way to eliminate style errors.