Kompx.com or Compmiscellanea.com

HTTP to HTTPS redirect in .htaccess

Web servers : Apache + nginx

Redirecting from HTTP to HTTPS, when the web server serving the pages is behind a load balancer or reverse proxy. Server configuration:

  • Apache + nginx;
  • SSL is enabled;
  • SSL-certificate is purchased, approved and installed.

That is, everything is up and running. So it is just the HTTP to HTTPS redirection that is left to get ready and start up. Directives for .htaccess file:

RewriteEngine On

RewriteCond %{HTTP_HOST} !^www\. [NC]

RewriteRule ^(.*)$ http://www.%{HTTP_HOST}/$1 [R=301,L]

RewriteCond %{HTTP:X_FORWARDED_PROTO} !https [NC]

RewriteRule ^(.*)$ https://%{HTTP_HOST}/$1 [R=301,L]

HTTP to HTTPS redirect

-- Enable runtime rewriting engine:

RewriteEngine On

-- If domain name has no www:

RewriteCond %{HTTP_HOST} !^www\. [NC]

-- Then replace it with domain with www:

RewriteRule ^(.*)$ http://www.%{HTTP_HOST}/$1 [R=301,L]

-- If HTTPS is not present:

RewriteCond %{HTTP:X_FORWARDED_PROTO} !https [NC]

-- Then replace domain without HTTPS with domain with HTTPS:

RewriteRule ^(.*)$ https://%{HTTP_HOST}/$1 [R=301,L]

Notes

1. X_FORWARDED_PROTO may instead be called X-Forwarded-Proto or even else. The point is to obtain the information from a load balancer or reverse proxy on the original request it gets. Load balancers or reverse proxies may provide the web server with this info and a header named X_FORWARDED_PROTO or X-Forwarded-Proto or else may be sent, holding the protocol string. It is most often so, but not always. So it should probably be determined by practice how to get the protocol string in a particular case.

2. The other way is just to set the environment variable (if it is suitable for the given web server):

SetEnvIf X_FORWARDED_PROTO https HTTPS=on

Then directives for .htaccess file are to be like this:

RewriteEngine On

SetEnvIf X_FORWARDED_PROTO https HTTPS=on

RewriteCond %{HTTP_HOST} !^www\. [NC]

RewriteRule ^(.*)$ http://www.%{HTTP_HOST}/$1 [R=301,L]

RewriteCond %{HTTP:HTTPS} !on [NV]

RewriteRule ^(.*)$ https://%{HTTP_HOST}/$1 [R=301,L]

3. Apache Module mod_rewrite docs: http://httpd.apache.org/docs/current/mod/mod_rewrite.html


Aliosque subditos et thema

 

Bold numbers in ordered lists

 

Numbers in an ordered list made bold without having any extra HTML tags added: List item List item List item HTML / XHTML. Code: <ol> <li>List item</li> <li>List item</li> <li>List item</li> </ol> CSS. Code: ol {counter-reset: item;} ol li {display: block;} ol li:before {content: counter(item) ". "; counter-increment: item; font-weight: bold;} There is no obvious way at the moment to style only numbers marking ordered list items. A workaround is to use a CSS counter instead of the default automatic numbering of ordered lists. The way a CSS counter is started allows to style specifically the marking numbers. Like in the example, where numbers in an ordered list are styled bold. This method also lets to use other characters after the numbers - besides dots. Like a parenthesis / round bracket instead of a dot. Or handling of space between the number, punctuation mark and the content proper of list item. [ 1 ] As well as Netscape 9.0+. [ 2 ] As well as Netscape 9.0+.

CSS centering absolutely positioned elements

 

CSS horizontal centering of an absolutely positioned element. Example: HTML / XHTML. Code: <div class="example"> <img src="image.jpg" alt="Image" /> </div> CSS. Code: .example {position: relative; left: 0px; top: 0px; height: 90px; width: 100%; float: left; padding: 10px; border: 1px #ccc solid; background: #fafafa; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; -ms-box-sizing: border-box; box-sizing: border-box;} .example img {position: absolute; left: 0px; right: 0px; margin: 0px auto; width: 68px;} An absolutely positioned img is centered in the example. But this method of horizontal centering also works with other both inline and block absolutely positioned elements. The width of an absolutely positioned element may also be in percent or other units. CSS properties of a container (here it is .example), holding an element to be centered, may vary. The element's centering is achieved by styles applied to the element itself: .example img {position: absolute; left: 0px; right: 0px; margin: 0px auto;}. [ 1 ] As well as Netscape 8.01+, Mozilla 1.5+. [ 2 ] As well as Netscape 8.01+, Mozilla 1.5+.