html - How to divide jquery tab to 4 equal divs? -


I am using the jquery tab, and one of my tabs has 4 Google charts (each contained by a div) . I want to be located on each of the 1/4 of the tab area (north, south, east and west of Scren).

Right now my HTML is:

  & lt; Div id = "chartsTab" & gt; & Lt ;! - Div which will catch the Volume column chart - & gt; & Lt; Div id = "chart_div_volume" style = "width: 400; height: 300" & gt; & Lt; / Div & gt; & Lt; / Div & gt; & Lt; Div id = "chart_div_midp" style = "width: 400; height: 300" & gt; & Lt; / Div & gt; & Lt; / Div & gt; & Lt; / Div & gt; & Lt; Div id = "chart_div_spread" style = "width: 400; height: 300" & gt; & Lt; / Div & gt; & Lt; / Div & gt; & Lt; / Div & gt; & Lt; Div id = "chart_div_volatility" style = "width: 400; height: 300" & gt; & Lt; / Div & gt; & Lt; / Div & gt;   

So my charts are below the other.

Here's a job.

HTML:

  & lt; Div id = "chartsTab" & gt; & Lt ;! - Div which will catch the Volume column chart - & gt; & Lt; Div id = "chart_div_volume" class = "tab" & gt; & Lt; / Div & gt; & Lt; Div id = "chart_div_midp" class = "tab" & gt; & Lt; / Div & gt; & Lt; Div style = "clear: both" & gt; & Lt; / Div & gt; & Lt; Div id = "chart_div_spread" class = "tab" & gt; & Lt; / Div & gt; & Lt; Div id = "chart_div_volatility" class = "tab" & gt; & Lt; / Div & gt; & Lt; / Div & gt;   

Note that the use of the div with both clear at that place, where you want the force of a new line.

Just adjust the desired width if you want to take it full screen, consider using%. But note that if the browser is re-shaped then% can get a wrong size. So if you type minimum-width .

CSS:

 . Tab {float: left; Width: 400px; Height: 3000px; }    

Comments

Popular posts from this blog

excel vba - How to delete Solver(SOLVER.XLAM) code -

github - Teamcity & Git - PR merge builds - anyway to get HEAD commit hash? -

ios - Replace text in UITextView run slowly -