NatSkinCss

This is a reference guide to all css classes used by NatSkin. These are all classes and not ids, that is all classes below are applied to the html markup using class="natXYZ". All classes refering to html elements that are part of the NatSkin templates are named using the nat prefix in their name (example: natBodyContents, natMain, natSideBar, etc).

NatSkin does not make use of positional css or floats. Instead the main layout is done using a html <table> element classified natLayoutTable that uses a fixed table layout (means: not depending on the inner content).

The reason for this is to provide a more reliable user experience on different browsers and a simplification of css code. So css means are used mainly for fonts, colors, spaces and margines but not for general page layouting on the client side. Instead different layouts are emitted by the server using different html markup.

The basic layout consists of a topbar (natTopBar), a middle part (natMiddle) holding the sidebar(s) (natSideBar) as well as the main area (natMain) and a bottom bar (natBottomBar). Within these boundaries NatSkin provides a one, two or three columns layout in the middle area depending on the sidebar being switched off, on the left/right side or displayed on both sides respectively. Different html markup and classification is done on the serverside so that adequat css takes effect in different configurations. For example if the sidebar is configured to be on the left it can be addressed using natSideBarLeft in addition to the standard natSideBar class. Accordingly the topic area (natMain) will be located on the opposite side and will be named natMainRight if the sidebar is on the left. If the sidebars are both switched off the natMain area will be called natMainRight and natMainLeft at the same time. The same logic applies to the natBottomBar although it is not part of the natMiddle. Nevertheless it will be classified natBottomBarLeft or natBottomBarRight depending on the sidebar being on the right or left side respectively. This is usefull if the bottom bar is to be displayed under the natMain area. Additionally the natBottomBar will be classified as natBottomBarBoth.

Alphabetic list

Class	Files	Description
natAction	edittopicactions.nat.tmpl, previewtopicactions.nat.tmpl, settingstopicactions.nat.tmpl	highlights current action
natAltButton	oopsleaseconflict.nat.tmpl, oopslocked.nat.tmpl, oopslockedrename.nat.tmpl, oopslogonbase.nat.tmpl, oopsmore.nat.tmpl, oopsnoformdef.nat.tmpl, oopsrev.nat.tmpl, renamebase.nat.tmpl, renamewebbase.nat.tmpl	alternative submit action in skin forms, see also natOkButton, natCancelButton
natAttachBody	attach.nat.tmpl	html body during attach action
natBody	page.nat.tmpl, view.plain.nat.tmpl, view.print.nat.tmpl	html body, see also natBodyPlain, natBodyPrint, nat...Body
natBodyContents	defaultbody.nat.tmpl, view.plain.nat.tmpl, view.print.nat.tmpl	contains all page content inside the natPageBox
natBodyPlain	view.plain.nat.tmpl	html boy using the plain.nat skin, see also natBody
natBodyPrint	view.print.nat.tmpl	using the print.nat skin, see also natBody
natBottomBar	defaultbody.nat.tmpl	bottom element below the natLayoutTable
natBottomBarBoth	defaultbody.nat.tmpl	natBottomBarBoth conditional classification: sidebar switched off
natBottomBarContents	defaultbody.nat.tmpl, view.plain.nat.tmpl	contents container inside the natBottomBar
natBottomBarLeft	defaultbody.nat.tmpl	natBottomBarBoth conditional classification: sidebar on the right
natBottomBarRight	defaultbody.nat.tmpl	natBottomBarBoth conditional classification: sidebar on the left
natBottomTopicActions	edit.nat.tmpl, preview.nat.tmpl
natBoxBorderBottomLeft	defaultbody.nat.tmpl
natBoxBorderBottomRight	defaultbody.nat.tmpl
natBoxBorderLeft	defaultbody.nat.tmpl
natBoxBorderRight	defaultbody.nat.tmpl
natBoxBorderTopLeft	defaultbody.nat.tmpl
natBoxBorderTopRight	defaultbody.nat.tmpl
natBreadCrumbs	edit.nat.tmpl, preview.nat.tmpl, view.nat.tmpl
natCancelAction	edit.nat.tmpl, preview.nat.tmpl
natCancelButton	changeform.nat.tmpl, moveattachment.nat.tmpl, oops.nat.tmpl, oopsattention.nat.tmpl, oopsempty.nat.tmpl, oopserrbase.nat.tmpl, oopsleaseconflict.nat.tmpl, oopslocked.nat.tmpl, oopslockedrename.nat.tmpl, oopslogonbase.nat.tmpl, oopsmngcreateweb.nat.tmpl, oopsmore.nat.tmpl, oopsnoformdef.nat.tmpl, oopsresetpasswd.nat.tmpl, oopsrev.nat.tmpl, rename.nat.tmpl, renameconfirm.nat.tmpl, renamerefs.nat.tmpl, renamewebbase.nat.tmpl, renamewebconfirm.nat.tmpl
natChangeFormBody	changeform.nat.tmpl	html body during changeform action
natChangesBody	changes.nat.tmpl	html body during changes cgi action
natContact	oops.nat.tmpl
natCopyRight	defaultbody.nat.tmpl, view.plain.nat.tmpl
natCurrentAction	edit.nat.tmpl, preview.nat.tmpl
natDiffOptions	oopsrev.nat.tmpl
natDoneAction	edit.nat.tmpl, preview.nat.tmpl
natEdit	edit.nat.tmpl, editform.nat.tmpl, settings.nat.tmpl
natEditAction	edit.nat.tmpl, preview.nat.tmpl
natEditBody	edit.nat.tmpl	html body during edit cgi action
natEditBoldButton	edittoolbar.nat.tmpl
natEditBoldButtonAction	edittoolbar.nat.tmpl
natEditButton	previewtoolbar.nat.tmpl
natEditCancelButton	edittoolbar.nat.tmpl, previewtoolbar.nat.tmpl
natEditCenterButton	edittoolbar.nat.tmpl
natEditCenterButtonAction	edittoolbar.nat.tmpl
natEditDoneButton	edittoolbar.nat.tmpl, previewtoolbar.nat.tmpl
natEditEditTools	edittoolbar.nat.tmpl
natEditExtButton	edittoolbar.nat.tmpl
natEditExtButtonAction	edittoolbar.nat.tmpl
natEditH1Button	edittoolbar.nat.tmpl
natEditH2Button	edittoolbar.nat.tmpl
natEditH3Button	edittoolbar.nat.tmpl
natEditH4Button	edittoolbar.nat.tmpl
natEditHeadlineButtonAction	edittoolbar.nat.tmpl
natEditHeadlineTools	edittoolbar.nat.tmpl
natEditHelpButton	edittoolbar.nat.tmpl
natEditHelpTools	edittoolbar.nat.tmpl
natEditImageButton	edittoolbar.nat.tmpl
natEditImageButtonAction	edittoolbar.nat.tmpl
natEditIntButton	edittoolbar.nat.tmpl
natEditIntButtonAction	edittoolbar.nat.tmpl
natEditItalicButton	edittoolbar.nat.tmpl
natEditItalicButtonAction	edittoolbar.nat.tmpl
natEditJustifyButton	edittoolbar.nat.tmpl
natEditJustifyButtonAction	edittoolbar.nat.tmpl
natEditLeftButton	edittoolbar.nat.tmpl
natEditLeftButtonAction	edittoolbar.nat.tmpl
natEditMathButton	edittoolbar.nat.tmpl
natEditMathButtonAction	edittoolbar.nat.tmpl
natEditObjectTools	edittoolbar.nat.tmpl
natEditParagraphTools	edittoolbar.nat.tmpl
natEditPreviewButton	edittoolbar.nat.tmpl
natEditRightButton	edittoolbar.nat.tmpl
natEditRightButtonAction	edittoolbar.nat.tmpl
natEditSaveButton	edittoolbar.nat.tmpl, previewtoolbar.nat.tmpl
natEditSignatureButton	edittoolbar.nat.tmpl
natEditSignatureButtonAction	edittoolbar.nat.tmpl
natEditStrikeButton	edittoolbar.nat.tmpl
natEditStrikeButtonAction	edittoolbar.nat.tmpl
natEditSubButton	edittoolbar.nat.tmpl
natEditSubButtonAction	edittoolbar.nat.tmpl
natEditSupButton	edittoolbar.nat.tmpl
natEditSupButtonAction	edittoolbar.nat.tmpl
natEditTextTools	edittoolbar.nat.tmpl
natEditToolBar	edittoolbar.nat.tmpl
natEditUnderlinedButton	edittoolbar.nat.tmpl
natEditUnderlinedButtonAction	edittoolbar.nat.tmpl
natEditUndoButton	edittoolbar.nat.tmpl, previewtoolbar.nat.tmpl
natEditVerbatimButton	edittoolbar.nat.tmpl
natEditVerbatimButtonAction	edittoolbar.nat.tmpl
natErrorMsg	oopsmngcreateweb.nat.tmpl, oopsmoveerr.nat.tmpl, oopsrenameerr.nat.tmpl, oopssaveerr.nat.tmpl, oopssendmailerr.nat.tmpl, oopssoftwareerr.nat.tmpl
natFeedIcon	defaultbody.nat.tmpl
natFormAction	edit.nat.tmpl, preview.nat.tmpl
natFormActionButton	attachagain.nat.tmpl
natFormCancelButton	attachagain.nat.tmpl, attachnew.nat.tmpl
natFormOkButton	attachagain.nat.tmpl, attachnew.nat.tmpl
natHeaderArt	defaultbody.nat.tmpl
natLayoutTable	defaultbody.nat.tmpl
natLogonForm	oopslogonbase.nat.tmpl
natLogonFormButtons	oopslogonbase.nat.tmpl
natLogonFormHolder	oopslogonbase.nat.tmpl
natLogonFormLogin	oopslogonbase.nat.tmpl
natLogonFormPassword	oopslogonbase.nat.tmpl
natMain	defaultbody.nat.tmpl, view.plain.nat.tmpl, view.print.nat.tmpl
natMainContents	defaultbody.nat.tmpl, view.plain.nat.tmpl, view.print.nat.tmpl
natMainFooter	defaultbody.nat.tmpl
natMainFooterContents	defaultbody.nat.tmpl, view.plain.nat.tmpl, view.print.nat.tmpl
natMainFooterLeft	defaultbody.nat.tmpl
natMainFooterRight	defaultbody.nat.tmpl
natMainHeaderContents	defaultbody.nat.tmpl
natMainLeft	defaultbody.nat.tmpl
natMainRight	defaultbody.nat.tmpl
natMiddle	defaultbody.nat.tmpl, view.plain.nat.tmpl, view.print.nat.tmpl
natMiddleLeft	defaultbody.nat.tmpl
natMiddleRight	defaultbody.nat.tmpl
natMoveAttachmentBody	moveattachment.nat.tmpl	html body while moving attachments
natNotes	attachsidebar.nat.tmpl, changeformsidebar.nat.tmpl, moveattachmentsidebar.nat.tmpl, renamesidebar.nat.tmpl, renamewebsidebar.nat.tmpl
natOkButton	changeform.nat.tmpl, moveattachment.nat.tmpl, oops.nat.tmpl, oopsattention.nat.tmpl, oopschangepasswd.nat.tmpl, oopsempty.nat.tmpl, oopserrbase.nat.tmpl, oopslanguagechanged.nat.tmpl, oopsleaseconflict.nat.tmpl, oopslocked.nat.tmpl, oopslockedrename.nat.tmpl, oopslogonbase.nat.tmpl, oopsmngcreateweb.nat.tmpl, oopsmore.nat.tmpl, oopsnoformdef.nat.tmpl, oopsresetpasswd.nat.tmpl, oopsrev.nat.tmpl, rename.nat.tmpl, renameconfirm.nat.tmpl, renamerefs.nat.tmpl, renamewebbase.nat.tmpl, renamewebconfirm.nat.tmpl
natOops	oops.nat.tmpl
natOopsBody	oops.nat.tmpl	html body in oops messages
natOopsButtons	oops.nat.tmpl, oopsattention.nat.tmpl, oopschangepasswd.nat.tmpl, oopsempty.nat.tmpl, oopslanguagechanged.nat.tmpl, oopsleaseconflict.nat.tmpl, oopslocked.nat.tmpl, oopslockedrename.nat.tmpl, oopsmngcreateweb.nat.tmpl, oopsnoformdef.nat.tmpl
natOopsMessage	oops.nat.tmpl
natPageBox	defaultbody.nat.tmpl
natPreviewAction	edit.nat.tmpl, preview.nat.tmpl
natPreviewBody	preview.nat.tmpl	html body during preview action
natPreviewToolBar	previewtoolbar.nattmpl
natRdiffBody	rdiff.nat.tmpl	html body during rdiff action
natRevision	rdiff.nat.tmpl, view.nat.tmpl
natRenameBody	renamebase.nat.tmpl	html body in rename actions
natRenameWebBody	renamewebbase.nat.tmpl	html body in rename web action
natSaveAction	edit.nat.tmpl, preview.nat.tmpl
natSearch	search.nat.tmpl
natSearchAuthor	search.nat.tmpl
natSearchBody	searchbase.nat.tmpl	html body in search action
natSearchBox	defaultsidebar.nat.tmpl, defaulttopbar.nat.tmpl
natSearchBoxPos1	defaultsidebar.nat.tmpl
natSearchBoxPos3	defaultsidebar.nat.tmpl
natSearchBoxTop	defaulttopbar.nat.tmpl
natSearchHit	changes.nat.tmpl, search.nat.tmpl, searchrenameview.nat.tmpl
natSearchHitEven	search.nat.tmpl
natSearchHitOdd	search.nat.tmpl
natSearchRenameContents	renamebase.nat.tmpl, renamewebbase.nat.tmpl
natSearchRevision	search.nat.tmpl
natSearchString	search.nat.tmpl, searchformat.nat.tmpl, searchrenameview.nat.tmpl
natSearchTable	changes.nat.tmpl, search.nat.tmpl, searchrenameview.nat.tmpl
natSearchTableTitle	search.nat.tmpl
natSearchTarget	search.nat.tmpl
natSearchTotal	search.nat.tmpl, searchformat.nat.tmpl, searchrenameview.nat.tmpl
natSep	changes.nat.tmpl, defaulttopbar.nat.tmpl, edit.nat.tmpl, moveattachment.nat.tmpl, preview.nat.tmpl, renamebase.nat.tmpl, searchbase.nat.tmpl, settings.nat.tmpl, view.nat.tmpl
natSettingsBody	settings.nat.tmpl	html body during settings action
natSideBar	defaultbody.nat.tmpl
natSideBarContents	defaultbody.nat.tmpl
natSideBarLeft	defaultbody.nat.tmpl
natSideBarRight	defaultbody.nat.tmpl
natSideBarSearch	searchbox.nat.tmpl
natSideBarTitle	defaultsidebar.nat.tmpl
natSubmitOptions	edit.nat.tmpl, edit.nattmpl, preview.nat.tmpl, preview.nat.tmpl
natSyndicate	defaultbody.nat.tmpl
natTopBar	defaulttopbar.nat.tmpl
natTopBarSizer	defaulttopbar.nat.tmpl
natTopLeft	defaulttopbar.nat.tmpl
natTopLeftContents	defaulttopbar.nat.tmpl
natTopRight	defaulttopbar.nat.tmpl
natTopRightContents	defaulttopbar.nat.tmpl
natTopicActions	defaulttopbar.nat.tmpl
natTopicAttachments	attach.nat.tmpl, attachagain.nat.tmpl, view.nat.tmpl, view.plain.nat.tmpl, view.print.nat.tmpl
natTopicEditForm	form.nat.tmpl
natTWikiTopic	formtables.nat.tmpl
natTopicFormFirstCol	form.nat.tmpl, formtables.nat.tmpl
natTopicFormLabel	form.nat.tmpl
natTopicFormTitle	form.nat.tmpl, formtables.nat.tmpl
natUndoAction	edit.nat.tmpl, preview.nat.tmpl
natViewBody	view.nat.tmpl	html body for view action
natWebButtons	defaulttopbar.nat.tmpl
natWebButtonsContents	defaulttopbar.nat.tmpl
natWebSlogan	defaulttopbar.nat.tmpl
natWebTitle	defaulttopbar.nat.tmpl