Red Web Turtle

There are different reasons for negative margins not being translated properly in Chrome and Safari. This is a particular scenario that involves min-height. I had a div whose negative margin-top is not working in Chrome and Safari. Worked in Firefox, Opera and IE 9 but not working in Chrome and Safari. This is what I had: <div id="top-div"> <div class="container"> <img src="image-link" /> </div> </div> <div id="bottom-div"> <div class="container"> <p>text text text</p> </div> </div> The CSS for the above was like this: #top-div .container { min-height:250px; } #bottom-div { margin-top:-50px; } Now the fix. All I had to do was add "height:100%" in "#top-div .container", like this: #top-div .container { min-height:250px; height:100%; /* adding this does the trick for Chrome and Safari */ } Giving a fixed required h...

If you want to add .html extension to the end of the URL, try the code below in your .htaccess file. Also make sure Pretty URL is enabled from Dashboard. RewriteEngine On RewriteBase / RewriteCond %{REQUEST_FILENAME} !-f RewriteCond %{REQUEST_FILENAME}/index.html !-f RewriteCond %{REQUEST_FILENAME}/index.php !-f # Rewrite rule for displaying as directories #RewriteRule ^(.*)$ index.php/$1 [L] # disable this # Rewrite rule for appending .html RewriteRule ^(.*)\/$ $1.html [R] RewriteRule ^(.*).html$ index.php/$1 [L]