Display <div> content in column wise

Output

Here explain a way to display multiple <div> in column wise. To achieve this, we required one Parent <div>, and parent div contains multiple child <div>, we list child <div> in column wise.

To achieve this we just need a style like below.

<style>

 

* {

           box-sizing : border-box ;
    }

 

/* Create equal columns that floats next to each other */
.column{

                        float:left ;
          width:50%;

                        padding : 10px;

}

 

/* Clear floats after the columns */

.row:after{

                 content : "";

                        display : table;

                        clear : both;

}

</style>

hope style is straight forward, width in style-class .column and display in style-class .row:after is crucial here. Width property defining number of column to be displayed.

 

 

HTML
you should required one parent and multiple child <div> tags. Below is parent should look like below. Parent should refer style-class "row" 

 

<divname="parent"class="row"style="width:100%;">

Child should refer style-class "column" and put your content under the <div> tag 

 

<divname="child"class="column"style= "background: cornflowerblue" >

 

Once complete above, your child <div> will list in two column. If you decrease the width property of style-class .column to 30%, then <div> will list in 3 column, like that you could reduce the width to list desired level of columns.

HTML should be like below.

 

<divname="parent"style="width: 100%;"class="row">

           <divname="child"class="column"style= "background: cornflowerblue" >

                     <divname="childcontent">

                               My Content 1

                     </div>

           </div>

            

           <divname="child"class="column"style= "background: cornflowerblue" >

                     <divname="childcontent">

                               My Content 2

                     </div>

           </div>

 

           <divname="child"class="column"style= "background: cornflowerblue" >

                     <divname="childcontent">

                               My Content 3

                     </div>

           </div>

 

           <divname="child"class="column"style= "background: cornflowerblue" >

                     <divname="childcontent">

                               My Content 4

                     </div>

           </div>

</div>

 

Output

Vb.net change config file at runtime - Windows application

-->

Below help you to switch application configuration at runtime.

Suppose you are maintain different configuration file for different task.

Suppose I have a project name Vehicle, and below are my project config structure

 Main configuration is vehicle.config, and Byke and car has their own configuration setting. Now how my code fetch configuration data from Byke and Car when my application is running? How all code in Byke/car reads from its own configuration?

Solution

1. First create a class which is responsible for config change, below class will do it

Public MustInherit Class AppConfig

    Implements IDisposable

    Public Shared Function ChangeConfigPath(ByVal path As String) As AppConfig

        Return New ChangeAppConfig(path)

    End Function

    Private _OldConfig As String = String.Empty

    Public Overridable Property OldConfig() As String

        Get

            Return _OldConfig

        End Get

        Set(ByVal value As String)

            _OldConfig = value

        End Set

    End Property

    Private _DisposedValue As Boolean = False

    Public Overridable Property DisposedValue() As Boolean

        Get

            Return _DisposedValue

        End Get

        Set(ByVal value As Boolean)

            _DisposedValue = value

        End Set

    End Property

Public MustOverride Sub Dispose()

  Private Class ChangeAppConfig

        Inherits AppConfig

        Public Sub New(ByVal path As String)

            If OldConfig = String.Empty Then

                OldConfig = AppDomain.CurrentDomain.GetData("APP_CONFIG_FILE").ToString

            End If

            AppDomain.CurrentDomain.SetData("APP_CONFIG_FILE", path)

            GetType(System.Configuration.ConfigurationManager).GetField("s_initState", System.Reflection.BindingFlags.NonPublic OrSystem.Reflection.BindingFlags.[Static]).SetValue(Nothing, 0)

            Dim clConfigSystem As Object = GetType(System.Configuration.ConfigurationManager).GetField("s_configSystem", System.Reflection.BindingFlags.NonPublic Or System.Reflection.BindingFlags.[Static]).GetValue(Nothing)

            Dim clConfigHost As Object = clConfigSystem.GetType.GetField("_configHost", System.Reflection.BindingFlags.NonPublic OrSystem.Reflection.BindingFlags.[Instance]).GetValue(clConfigSystem)

            Dim clConfigPaths As Object = clConfigHost.GetType.GetField("_configPaths", System.Reflection.BindingFlags.NonPublic OrSystem.Reflection.BindingFlags.[Instance]).GetValue(clConfigHost)

            If Not clConfigPaths Is Nothing Then

                clConfigPaths.GetType.GetField("_applicationConfigUri", System.Reflection.BindingFlags.NonPublic Or System.Reflection.BindingFlags.[Instance]).SetValue(clConfigPaths, path)

            End If

        End Sub

        Public Overrides Sub Dispose()

        End Sub

    End Class

    Public Sub Dispose1() Implements System.IDisposable.Dispose

        If Not Me.DisposedValue Then

            Dim configPath As String = OldConfig

            If String.IsNullOrWhiteSpace(configPath) Then

                configPath = Common.Application_Config_Path

            End If

            AppDomain.CurrentDomain.SetData("APP_CONFIG_FILE", configPath)

            GetType(System.Configuration.ConfigurationManager).GetField("s_initState", System.Reflection.BindingFlags.NonPublic OrSystem.Reflection.BindingFlags.[Static]).SetValue(Nothing, 0)

            Dim clConfigSystem As Object = GetType(System.Configuration.ConfigurationManager).GetField("s_configSystem", System.Reflection.BindingFlags.NonPublic Or System.Reflection.BindingFlags.[Static]).GetValue(Nothing)

            Dim clConfigHost As Object = clConfigSystem.GetType.GetField("_configHost", System.Reflection.BindingFlags.NonPublic OrSystem.Reflection.BindingFlags.[Instance]).GetValue(clConfigSystem)

            Dim clConfigPaths As Object = clConfigHost.GetType.GetField("_configPaths", System.Reflection.BindingFlags.NonPublic OrSystem.Reflection.BindingFlags.[Instance]).GetValue(clConfigHost)

            If Not clConfigPaths Is Nothing Then

                clConfigPaths.GetType.GetField("_applicationConfigUri", System.Reflection.BindingFlags.NonPublic Or System.Reflection.BindingFlags.[Instance]).SetValue(clConfigPaths, Common.Application_Config_Path)

            End If

            Me.DisposedValue = True

        End If

        GC.SuppressFinalize(Me)

    End Sub
End Class

2. To call above class for changing config file, you needs to put your code inside using block

            Ex: code to read appSetting from Bype app.config, you have to write something like below

           

            Using AppConfig.ChangeConfigPath(“..\Vehicle\Byke\app.config”) ‘write the full app.config path here

           Dim BykemaxSpeed As string = ConfigurationManager.AppSetting[“BykeMaxSpeed”]

End Using

Note: app.config path should be a full path

Whenever you needs to read something for your config file, then write those code inside using block.

below is a simple javascript to tell you how to call web service with parameter

var WebReq = null;

function findZip() {
       if (window.XMLHttpRequest)
                WebReq = new XMLHttpRequest();
       else if (window.ActiveXObject) {
                  if (new ActiveXObject("Microsoft.XMLHTTP"))
                       WebReq = new ActiveXObject("Microsoft.XMLHTTP");
                  else
                       WebReq = new ActiveXObject("Msxml2.XMLHTTP");
                  }

var url = "http://xxxxxx/getCityState";
WebReq.open("post", url, true);
WebReq.setRequestHeader("Host","localhost:2508/IVA");
WebReq.setRequestHeader("Content-Type","application/x-www-form-urlencoded");
WebReq.setRequestHeader("Content-Length","100");
WebReq.onreadystatechange = Result;
}

Javascript in cross browser

I just started investigating on how to code javascript for cross plateform support. This is not complete I will update this blog in later. Please let me know if you are facing any cross plate-form issue so that i could help you.

      AVOID USING IF Browser = 'Internet Explorer' or 'morzilla' or 'chrome' CHECKINGS AS POSSIBLE. 

•  use attribute function to set/get object/control property

               IE will support you to write script like,

                     MyIMG.src = 'https://www.google.com';

                but above line will not work in chrome and morzilla browsers. so re-write the code like which will work in IE, Morzilla, Chrome , safary etc etc.

                    MyIMG.setAttribute('src',''https://www.google.com');

                     to get property use getAttribute
                     ex: var imgsrc = MyIMG.getAttribute('src');