2013-04-11

Hiding the ASPX markup when publishing an ASP.NET Web application

There are times that we need to hide the markup source from the published ASPX files. We have an option for that in the Visual Studio 2012 Update 2.

1) Right click on the web project from the solution explorer and choose Publish…

1

2) In the Publish Web dialog box, create a new profile (Or update an existing profile) and press Next > (Or choose the Connection tab). From there, choose your publish method (I’m using File System) and press Next >

2

3) In the Settings tab, expand the File Publish Options and tick Precompile during publishing.

3

4) Then click the Configure link next to Precompile during publishing option. It will open up a window shown as below. From there, un-tick Allow precompiled site to be updatable option and click OK.

4

5) Now you are done! Click Publish and it will publish the project. If you look in to the source code of ASPX, you will see the message “This is a marker file generated by the precompilation tool, and should not be deleted!”. But you can’t see the source code. If you look in to the bin folder of the published project, you will see additional files (Extension with .compiled) which are responsible for mapping the assembly code in to ASPX files.

For visual studio 2010 and Visual Studio 2012 (Without update), you will have to install the updates as describe in this link.

2013-04-01

How to make transparent elements without affecting the child elements

If we define the Opacity of an element with the usual CSS Opacity style, it will affect for the child elements too. It doesn’t matter whether you override the opacity in child element or not, it won’t change back. To get rid of that, we can use the below CSS3 style.

rgba(0, 0, 0, 0.4);

rgba is a CSS3 style. We can define the color using R G B values and as the final parameter, we can pass the opacity level. Then it will affect only for that element. See how cool and easy it is?

If you are worrying about the support of CSS3 in your browser, then you have two options.

1. Instead of making the elements as inner, you could always use position and margin styles to place the element on top of the other element. In that way, there are no child elements so won’t affect the opacity.

2. You can simply make images of the transparent elements and use them.