SitePoint Sponsor |
|
User Tag List
Results 1 to 7 of 7
Thread: 2 column form
-
Oct 7, 2007, 16:10 #1
- Join Date
- May 2007
- Posts
- 121
- Mentioned
- 0 Post(s)
- Tagged
- 0 Thread(s)
2 column form
Hello Folks,
is it possible to have a 2 column forum using fieldset ???
I tried
Code:#leftColumn { left:0; width: 50%; } #rightColumn { left: 50%; width: 50%; }
HTML Code:<form> <fieldset> <legend>This is my form</legend> <div id="leftColumn"> <div id="elementWrap"> <label class="fieldName">name</label> <input type="text" class="textField" /> </div> </div> <div id="rightColumn"> <div id="elementWrap"> <label class="fieldName">email</label> <input type="text" class="textField" /> </div> </div> </fieldset> </form>
THANKSAlla prossima ...
-
Oct 7, 2007, 16:28 #2
- Join Date
- May 2006
- Location
- Aurora, Illinois
- Posts
- 15,476
- Mentioned
- 0 Post(s)
- Tagged
- 0 Thread(s)
It won't work in Internet Explorer due to the way that IE styles fieldsets.
Wrap each fieldset in a DIV, give that DIV a class of "fieldset" and then stick a SPAN inside your legends.
http://www.tyssendesign.com.au/artic...gends-of-style has more information on how to do this.
Then float the DIVs with the class of "fieldset" normally. You also need to give your inputs a unique ID and then add the for="" attribute to the associated label, putting the ID of the input inside the label's for="" attribute.Save the Internet - Use Opera | May my mother rest in peace: 1943-2009
Dan Schulz - Design Team Advisor | Follow me on Twitter
SitePoint References: HTML CSS JavaScript | Become A Guru
WordPress SEO Checklist | What WordPress Plugins Do You Use?
Web Standards Curriculum | Image Free Equal Height Columns
-
Oct 7, 2007, 18:16 #3
- Join Date
- May 2007
- Posts
- 121
- Mentioned
- 0 Post(s)
- Tagged
- 0 Thread(s)
Thanks Dan, I use FireFox on Mac
Alla prossima ...
-
Oct 8, 2007, 03:30 #4
- Join Date
- Dec 2004
- Location
- Derbyshire - UK
- Posts
- 2,651
- Mentioned
- 0 Post(s)
- Tagged
- 0 Thread(s)
-
Oct 8, 2007, 03:38 #5
- Join Date
- Dec 2004
- Location
- Derbyshire - UK
- Posts
- 2,651
- Mentioned
- 0 Post(s)
- Tagged
- 0 Thread(s)
Also, the "left" value is only used with absolute or relative positioning. You'll need to use float: left; to get any element to sit next to each other (display: inline; also works but width, height etc cannot be applied).
-
Oct 8, 2007, 10:31 #6
- Join Date
- May 2007
- Posts
- 121
- Mentioned
- 0 Post(s)
- Tagged
- 0 Thread(s)
I'm sorry I have not specified that I'm working on web application (not a web site) and all the users will use WebRunner to use the application.
So I don't have any IE, Opera compatibility issue.
Thnak you CSSWIZ for your comments.Alla prossima ...
-
Oct 8, 2007, 11:39 #7
- Join Date
- Dec 2004
- Location
- Derbyshire - UK
- Posts
- 2,651
- Mentioned
- 0 Post(s)
- Tagged
- 0 Thread(s)
Ah, in that case ignore my comments about the browsers, it never ceases to amaze me how many people state that they use a specific browser, specific resolution with all the plugins and expect everyone else to see the same so sorry for assuming you fell into this category
The other comments about the left value still apply though
Bookmarks