No CSS Positioning

No CSS Positioning is primarily an advanced setting for users who know HTML and want to exclude CSS code from the object. By using the No CSS Positioning setting, you can tell SiteSpinner™ to leave positioning coordinates entirely out of the underlying project code. Thus, the actual location of an object without CSS positioning will depend upon other factors, including which browser is being used, whether the object is a member of a group or table, the location of other objects on the page, and so on. With No CSS on, the objects’ position in the work window will not affect the actual position when published.

The No CSS Positioning option will help ensure that every part of your page will be visible to your users. However, it affords the least control over where page elements will appear with regard to page layout.

No CSS Positioning settings are used primarily on code objects or imported HTML that include their own positioning. It also is a useful option when you are setting tables to be a percentage of the browser window size.

You can assign No CSS Positioning to an object using the Transformations Tab of the Object Editor dialog box. (For more information, see Object Editor Dialog Box.) Or, you can apply the No CSS Positioning setting globally to all objects in your project on the Project Target Options dialog box. (For more information, see Project Target Options Dialog Box.)

Setting Positioning Attributes

To set the positioning attributes for a single object:

  1. Double-click the object in the Work Window whose positioning attributes you wish to set.

    The Object Editor dialog box will open. For more information, see Object Editor Dialog Box.

  2. Click the Transformations Tab.
  3. To remove all positioning attributes for the object from the underlying HTML or SVG code, click to checkmark the No CSS Positioning option box, and then proceed to step 6

    OR

    If you want to set absolute or relative positioning attributes for the object, proceed to step 4.

  4. To set an absolute horizontal position for the object, click the Absolute Horizontal Position radio button

    OR

    To set a relative horizontal position for the object, click the Relative Horizontal Position radio button.

  5. To set an absolute vertical position for the object, click the Absolute Vertical Position radio button

    OR

    To set a relative vertical position for the object, click the Relative Vertical Position radio button.

  6. When you are finished, click OK. The dialog box will close.

To set the positioning attributes for all objects in the project:

By default, all objects are initially set with Absolute Positioning attributes.

  1. Select Options>Project Options.

    The Project Target Options dialog box will open. For more information, see Project Target Options Dialog Box.

  2. Click the More button to expand the dialog box.
  3. To remove all positioning attributes for all objects from the underlying HTML or SVG code, click to checkmark the No CSS option box, and then proceed to step 6

    OR

    If you want to set relative positioning attributes for all objects, proceed to step 4.

  4. To set relative horizontal positioning for all objects, click to checkmark the H Pos option box.
  5. To set relative vertical positioning for all objects, click to checkmark the V Pos option box.
  6. Click OK. The dialog box will close, and the positioning settings will be applied to all new objects in the project and to new, blank projects.

The setting will not affect existing objects. To apply settings to existing objects in the project click the Apply to all objects button.

 Previous Next