KeenUser
KeenUser

Reputation: 5525

How Do I make a div tag occupy the half of the right hand side of my Web page?

It is a basic HTML question.

I have some div tags, which have some controls and occupy left half of my screem.

I Want to have a div tag to display some messages in the right side? I used somthings like:

float = right;

in my css class. It didn't seem to work. What other properties I need to set.

Here is the code sample

<div class ="header_label">
@Html.GetLocalizedString("program_snapshotRecipientAdress")&nbsp; @Html.TextBox("txtRcpntAdress")
</div>

   <div class ="header_label">
@Html.GetLocalizedString("program_snapshotUsertype1") &nbsp; @Html.RadioButton("Usertype", "One", new { id="rb1"})
 &nbsp; &nbsp;
@Html.GetLocalizedString("program_snapshotUsertype2") &nbsp; @Html.RadioButton("Usertype", "Two", new { id = "rb2" })
<div class ="commentsHeight"></div>
 </div>
   <div class ="header_label">
@Html.GetLocalizedString("program_snapshotDate") &nbsp; @Html.TextBox("SnapshotDate")
</div>

  <div id ="CMSContent">
<div class ="CMS-message">
@Html.Raw("S=This is the div I need to place in the right hand side")
</div>
</div>

Upvotes: 6

Views: 59813

Answers (4)

Ali Sheikh
Ali Sheikh

Reputation: 1

if you want to show your form or something in two halfs or grids use this: float: right; width: 50%;

Upvotes: 0

TGM
TGM

Reputation: 1679

  1. Are you sure that you named the div correctly?
  2. the correct way to your command is

    float : right;
    
  3. If you want your div to be half of your screen you should write something like:

    width : 50%;
    

Upvotes: 1

Marco Pace
Marco Pace

Reputation: 3870

I didn't understand your question so much, but I'll try to answer. If you have some div on the left and you want another one on the right you have two choice:

1) The first one is to set one div on the right and another on the left:

<div>
    <div style="float: left; width: 50%">I'm on the left</div>
    <div style="float: right; width: 50%">I'm on the right</div>
</div>

2) The second one is to set every div on the left

<div>
    <div style="float: left; width: 50%">I'm on the left</div>
    <div style="float: left; width: 50%">I'm on the second on the left</div>
</div>

Upvotes: 16

dougajmcdonald
dougajmcdonald

Reputation: 20057

You can make a div occupy the right hand side of the screen in a multitude of ways, one of which is 'floating' as you've found.

This takes the element out of the normal 'flow' of the document and allows it to occupy a different area of the screen depending on parent elements etc.

At a glance you would need to write:

float: right;

In your CSS, rather than = but if you could post some html and css in a more full form, some better advice can be provided.

Upvotes: 0

Related Questions