You are viewing our Forum Archives. To view or take place in current topics click here.
[HTML CSS] Help designing comment form
Posted:

[HTML CSS] Help designing comment formPosted:

GamerTechz
  • TTG Addict
Status: Offline
Joined: Feb 11, 201212Year Member
Posts: 2,185
Reputation Power: 88
Status: Offline
Joined: Feb 11, 201212Year Member
Posts: 2,185
Reputation Power: 88
Ok so I have made a nice comment system for my minecraft server site, and I would like to add some general rules to the comment posting. Its a jquery box that slides down when someone clicks on a button, and then this is showen: [ Register or Signin to view external links. ]

How would I add rules next to the form with out using the position: absolute in css. Is there another way? I have tried using a table but the rules would not show up the way I want them to.
#2. Posted:
Rhymes
  • TTG Addict
Status: Offline
Joined: Dec 30, 201112Year Member
Posts: 2,311
Reputation Power: 120
Status: Offline
Joined: Dec 30, 201112Year Member
Posts: 2,311
Reputation Power: 120
It's hard to tell without actually working with your source. It all depends on how you structured the rest of your site..
#3. Posted:
Z61
  • TTG Fanatic
Status: Offline
Joined: Apr 16, 201014Year Member
Posts: 4,309
Reputation Power: 179
Status: Offline
Joined: Apr 16, 201014Year Member
Posts: 4,309
Reputation Power: 179
Use a table, simple but requires some formatting.
#4. Posted:
MLP
  • TTG Contender
Status: Offline
Joined: Oct 26, 201013Year Member
Posts: 3,869
Reputation Power: 177
Status: Offline
Joined: Oct 26, 201013Year Member
Posts: 3,869
Reputation Power: 177
There's nothing on that form that's actually yours - it's just using the botstrap framework.

As for adding some text next to it, use something like this (This is built into the bootstrap framework, so there's no extra effort required on your part):


<div class="row">
<div class="span6">
<!-- form here -->
</div>
<div class="span6">
<!-- rules here -->
</div>
</div>
#5. Posted:
GamerTechz
  • TTG Addict
Status: Offline
Joined: Feb 11, 201212Year Member
Posts: 2,185
Reputation Power: 88
Status: Offline
Joined: Feb 11, 201212Year Member
Posts: 2,185
Reputation Power: 88
MLP wrote There's nothing on that form that's actually yours - it's just using the botstrap framework.

As for adding some text next to it, use something like this (This is built into the bootstrap framework, so there's no extra effort required on your part):


<div class="row">
<div class="span6">
<!-- form here -->
</div>
<div class="span6">
<!-- rules here -->
</div>
</div>
I never said it was my form that I coded, so thanks
#6. Posted:
AXR
  • Powerhouse
Status: Offline
Joined: Mar 29, 201212Year Member
Posts: 430
Reputation Power: 18
Status: Offline
Joined: Mar 29, 201212Year Member
Posts: 430
Reputation Power: 18
Why not use pos:absolute?
It's probably the easiest way.
#7. Posted:
iyop45
  • Prospect
Status: Offline
Joined: Apr 15, 201113Year Member
Posts: 614
Reputation Power: 83
Status: Offline
Joined: Apr 15, 201113Year Member
Posts: 614
Reputation Power: 83
AXR wrote Why not use pos:absolute?
It's probably the easiest way.

Well GamerTechz is right in avoiding absolute positioning as being overly depending on this attribute tends to lead to sites of which display differently on different resolutions. If you're going to use absolute positioning at least wrap it in a relative div.

You could use tables but, it's generally bad practice (your choice though).
What you want to try and do is wrap both the form and the rules in a relative div and float them on both left and right, assuming both the rules and form are in the same parent div prior. I can't really give an answer as I don't your styling, heights etc but perhaps this'll give you an idea of how to approach it:

<div id="parent_wrap" style="">
     <div id="rules_wrap" style="position:relative;float:left">bleh</div>
     <div id="form" style="position:relative;float:right">form...</div>
</div>


Though if you could actually give some of your source or even a link to your page and I'm sure a better answer can be given by somebody.
#8. Posted:
GamerTechz
  • TTG Addict
Status: Offline
Joined: Feb 11, 201212Year Member
Posts: 2,185
Reputation Power: 88
Status: Offline
Joined: Feb 11, 201212Year Member
Posts: 2,185
Reputation Power: 88
AXR wrote Why not use pos:absolute?
It's probably the easiest way.
I dont want to do that cause then the responsive bootstrap design would be messed up.
#9. Posted:
AXR
  • Powerhouse
Status: Offline
Joined: Mar 29, 201212Year Member
Posts: 430
Reputation Power: 18
Status: Offline
Joined: Mar 29, 201212Year Member
Posts: 430
Reputation Power: 18
GamerTechz wrote
AXR wrote Why not use pos:absolute?
It's probably the easiest way.
I dont want to do that cause then the responsive bootstrap design would be messed up.

I noticed short after, I recommend to follow what iyop45 told you.
Jump to:
You are viewing our Forum Archives. To view or take place in current topics click here.