Comments

• 

  Langy

  Posts: 364 August 2012

  Well, first off the table will need a class. Stick:
  
  table(classname).
  
  Right above where the table starts.
  
  Next, stick float:right into the class's CSS to make it float to the right and have text wrap around it. I'm not all that sure what you mean by fixing it to a certain pixel, however - do you want that text to [i]always[/i] appear to be, say, 100 pixels down and 100 pixels to the left of the edge of the screen, no matter where you're scrolled to on the page? If so, use position:fixed and left: or right: and top: or bottom: to maneuver the table to the position you'd like. If you want the table to scroll with the page, use position:relative instead.
  
  I'm not sure what you mean by 'anchor text to another part of the page'. OP pages utilize the XHTML 1.0 Transitional doctype, so I assume that's what you need to code it in.
• 

  gaaran

  Posts: 740 August 2012

  I'm not really sure how to combine textile and the CSS stuff (I do everything in HTML), but yes, Langy is right.
  
  1. Assign the table a class.
  2. You want the table to be in a fixed position relative to your content, I would use position:absolute. This will fix the table's position, but it will be relative to the container it's in (i.e. the campaign content).
  3. Assign pixel values, sure as top:100px;left:100px; That will position the top left corner 100px from the top and left side of the container.
  
  I don't think you can have the text dynamically flow around a fixed position div. If you want the text to conform to the shape of the table, then the table will probably have to scroll with the rest of the page (unless there's a technique i don't know about, that would be handy). Then you would want to do a float:left or right, and then position it like normal.
  
  Do you have a link to what you are trying to do?
• 

  Langy

  Posts: 364 August 2012

  Position:Absolute won't do what he wants. Specifically, it will make it so the table is overlayed on top of any text (or the other way around; depends on where the text and the table are), rather than make it so text wraps around the table.
• 

  gaaran

  Posts: 740 August 2012

  yeah, that's why i mentioned floating it, same as you. I thought position:fixed did about the same thing as absolute, except the "top" and "left" were from the page border, rather than the container. If position:fixed will allow the text to wrap, that's news to me, I'll have to try it :).
• 

  Huscurian

  Posts: 3 August 2012

  @Langy, thanks for the information. So what you are saying is create a class within the table(). By CSS standards, that means I have to create a list of classes, define them, and then use the # to tag the class. By then, I would have to start using that class in the parenthesis after the table. Am I reading this right or is Obsidian Portal different when it comes to coding?
  
  Thus far my web programming language(s) usually includes HTML 4.01, some CSS, a little of XHTML, and nothing more. Is there a web programming language that I am not aware of that the Portal uses?
  
  @gaaran, thanks for your input! :)
  
  Yes, I do have a link to what I'm trying to do, specifically the page where I am trying to create the border of the table, but make sure the border does not take up the whole page. I wanted the border to be on the right side, where it contains all the useful information in a brief manner while detailing the more meatier parts on the left, text wrapped around the table.
  
  Here's the link: http://www.obsidianportal.com/campaign/gregalion-1452-and-beyond/wikis/gregalion
  
  Keep in mind that this is a work in progress.
• 

  gaaran

  Posts: 740 August 2012

  You could do something like:
  
  .table {
  position:relative;
  float:right;
  width:200px;
  top:10px;
  right:10px;
  margin:10px;
  }
  
  This will make the table 200px wide, on the right, 10px from the top and left of the container (campaign content), and the text should wrap around it. The only thing I'm not sure about is connecting the CSS to textile, I don't use textile. Also, for a class, it's formatted .class, # is for ids (i.e. #id).
  
  I think that should work, but I usually do all my coding by trial and error, and I haven't tried this :).
• 

  Langy

  Posts: 364 August 2012 edited August 2012

  Huscarian: That's about right. In order to add the class to the table in Textile (http://redcloth.org/hobix.com/textile/), just use something like this:
  
  table(class-name-here).
  | Table Starts Here | Continues|
  | More Cells | Ends Here |
  
  That table(class-name-here). part is what gives the table its class. Check out the textile reference for more info on things like that.
  
  If you aren't using the css implementation in OP, you can instead use:
  
  table{styling-goes-here}.
  | Table Starts Here | Continues|
  | More Cells | Ends Here |
  
  Put everything that you'd normally put in a style="" declaration in the 'styling-goes-here' part. So if you were trying to use style="float:right;color:red", you'd just put in table{float:right;color:red}.

  Post edited by Langy on August 2012