I'm attempting to align two cells next to each other. The code i have works for IE but not Firefox. Firefox places the second cell (form-right) underneath the first cell (form-left). Here is the code i'm using.
<style type="text/css">
#form-left {
float:left;
width:45%;
}
#form-right {
width:45%;
}
</style>
</head>
<body>
<h3>Looking for work?</h3>
<div id="form-left">
Forename1:*
</div>
<div id="form-right">
Surname1:*
</div>
</body>Hmm.
My current style for left and right is:
.left {
clear: left;
float: left;
width:49%;
margin-bottom:.5em;
}
.right {
float:right;
width:50%;
margin-bottom:.5em;
}
Works fine for me - but I think floats in both left and right is frowned on by some.
Bottom margin is for spacing from further rows - when the left and right classes are placed in wrapping divs.
If you are only going to place things left and right once, id is fine. Otherwise I would use class.Hi there silencer01,
try it like this...
<style type="text/css">
#form-left {
float:left;
width:45%;
}
#form-right {
float:left;
width:45%;
}
</style>
coothead
<style type="text/css">
#form-left {
float:left;
width:45%;
}
#form-right {
width:45%;
}
</style>
</head>
<body>
<h3>Looking for work?</h3>
<div id="form-left">
Forename1:*
</div>
<div id="form-right">
Surname1:*
</div>
</body>Hmm.
My current style for left and right is:
.left {
clear: left;
float: left;
width:49%;
margin-bottom:.5em;
}
.right {
float:right;
width:50%;
margin-bottom:.5em;
}
Works fine for me - but I think floats in both left and right is frowned on by some.
Bottom margin is for spacing from further rows - when the left and right classes are placed in wrapping divs.
If you are only going to place things left and right once, id is fine. Otherwise I would use class.Hi there silencer01,
try it like this...
<style type="text/css">
#form-left {
float:left;
width:45%;
}
#form-right {
float:left;
width:45%;
}
</style>
coothead