Model Site Optional secondary text for expansion
on name or identity only

CSS Styles:
Extras For Home Pages and Other Layouts

This space might be occupied by an image, or text like this. Because the margins need to be removed from this page, a special style sheet must be attached in the editable head area: /Templates/main_layoutextras.css. It overrides the intrinsic "bodycontent" id div margins, so that the design can occupy the entire space within the rules of this main_content editable area. Sectioning the main_content area is accomplished with a designer table, which creates the ruled sections. This headline and paragraph text is floated within a nested table that simulates the margins removed from "bodycontent." The supplemental stylesheet may also contain special styles that are only appropriate in this context, such as margins_othercontent.
div.boxlabel - bottom rule automatic
illustration
Content for class "text_caption" Goes Here

div.margins_bodycontent - Applied to a div to create a container with 18px margins (remember that the default margins have been removed) for the main content of the page.

p - Sed malesuada, ante quis semper feugiat, dui dui nonummy magna, quis fringilla ipsum nibh vitae ipsum. Vivamus ut nulla vel mi dictum hendrerit. Ut interdum diam id sem. Maecenas elementum cursus pede. Aenean suscipit sem quis tellus posuere sagittis. Sed eleifend leo eget risus. Velit sed egestas lacinia, velit nisl convallis velit, at lobortis quam lacus ut eros. Nulla pede.


div.margins_othercontent - Applied to a div to create a container with 10px margins (remember that the default margins have been removed) for other content of the page.

The HR above is a standard, unclassed <hr>, styled to create a flat, 1px, SoM Rule Grey line with reduced margins, top and bottom.

h3 Lorem Ipsum Dolor Sit Amet

Sed malesuada, ante quis semper feugiat, dui dui nonummy magna, quis fringilla ipsum nibh vitae ipsum. Vivamus ut nulla vel mi dictum hendrerit.

div.boxlabel (w/ H3)

div.margins_othercontent - Applied to a div to create a container with 10px margins (remember that the default margins have been removed) for other content of the page.
div.boxlabel ruleontop
div.margins_othercontent - p In the above example, the class ruleontop has been added to the boxlabel class, so that the box label will have a rule on top.

Rules (above) can also be dropped within content divs to create text separators (as opposed to section dividers).

div.boxitem - creates rulebox with 5px margins and fading background image; for use with promotional and other highlights elements.

The above rule is an <hr> with class set to nomargins; note that IE (6 AND 7) forces a small amount of vertical spacing above and below the rule, regardless. You may want to use a table element in situations where there should never be any vertical spacing.


The above rule is an <hr> with class set to hr_black


The above rule is an <hr> with class set to hr_grey


The above rule is an <hr> with class set to hr_white

Nullam fermentum mauris. Etiam malesuada ante hendrerit neque. Integer vel sapien a erat lobortis molestie. Nullam elit elit, scelerisque at, euismod eget, tincidunt sed, pede. Pellentesque tellus enim, semper id, volutpat in, pulvinar eget, nulla.

div.boxlabel rulebox

"rulebox" class adds rule to all 4 sides; for use in floating highlight box. Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Nulla dapibus. Nullam congue. Integer ullamcorper magna sit amet lorem blandit nonummy. Fusce vestibulum felis nec sapien. Duis aliquam vehicula purus.

Note: div.margins_othercontent ruleonbottom - rule added to bottom of this div.

div without settings (before margins added)
Spacing removed from this demo text. Commodo, nibh sed dignissim ultrices, tellus massa posuere sapien, quis suscipit eros nunc ac libero. Aliquam tempor, risus a dictum placerat.
div.addmarginbottom10
Spacing removed from this demo text. Commodo, nibh sed dignissim ultrices, tellus massa posuere sapien, quis suscipit eros nunc ac libero. Aliquam tempor, risus a dictum placerat.
div.addmarginbottom5
Spacing removed from this demo text. Commodo, nibh sed dignissim ultrices, tellus massa posuere sapien, quis suscipit eros nunc ac libero. Aliquam tempor, risus a dictum placerat.
div.addmarginhorizontal10
Spacing removed from this demo text. Commodo, nibh sed dignissim ultrices, tellus massa posuere sapien, quis suscipit eros nunc ac libero. Aliquam tempor, risus a dictum placerat.
div.addmarginhorizontal5
Spacing removed from this demo text. Commodo, nibh sed dignissim ultrices, tellus massa posuere sapien, quis suscipit eros nunc ac libero. Aliquam tempor, risus a dictum placerat.
div.addmarginleft10
Spacing removed from this demo text. Commodo, nibh sed dignissim ultrices, tellus massa posuere sapien, quis suscipit eros nunc ac libero. Aliquam tempor, risus a dictum placerat.
div.addmarginleft5
Spacing removed from this demo text. Commodo, nibh sed dignissim ultrices, tellus massa posuere sapien, quis suscipit eros nunc ac libero. Aliquam tempor, risus a dictum placerat.
div.addmarginright10
Spacing removed from this demo text. Commodo, nibh sed dignissim ultrices, tellus massa posuere sapien, quis suscipit eros nunc ac libero. Aliquam tempor, risus a dictum placerat.
div.addmarginright5
Spacing removed from this demo text. Commodo, nibh sed dignissim ultrices, tellus massa posuere sapien, quis suscipit eros nunc ac libero. Aliquam tempor, risus a dictum placerat.
div.addmargintop10
Spacing removed from this demo text. Commodo, nibh sed dignissim ultrices, tellus massa posuere sapien, quis suscipit eros nunc ac libero. Aliquam tempor, risus a dictum placerat.
div.addmargintop5
Spacing removed from this demo text. Commodo, nibh sed dignissim ultrices, tellus massa posuere sapien, quis suscipit eros nunc ac libero. Aliquam tempor, risus a dictum placerat.
div.addmarginvertical10
Spacing removed from this demo text. Commodo, nibh sed dignissim ultrices, tellus massa posuere sapien, quis suscipit eros nunc ac libero. Aliquam tempor, risus a dictum placerat.
div.addmarginvertical5
Spacing removed from this demo text. Commodo, nibh sed dignissim ultrices, tellus massa posuere sapien, quis suscipit eros nunc ac libero. Aliquam tempor, risus a dictum placerat.
div.addpadding10
Spacing removed from this demo text. Commodo, nibh sed dignissim ultrices, tellus massa posuere sapien, quis suscipit eros nunc ac libero. Aliquam tempor, risus a dictum placerat.
div.addpadding5
Spacing removed from this demo text. Commodo, nibh sed dignissim ultrices, tellus massa posuere sapien, quis suscipit eros nunc ac libero. Aliquam tempor, risus a dictum placerat.
div.background_white - adds white background to any HTML element


div.box_withboxlabel - initial H1-H6 becomes auto boxlabel

For floating (non-aligned) highlights boxes; similar to box[left]_withboxlabel - Sed in ligula. Maecenas iaculis, justo vel pellentesque blandit, lectus nunc aliquet sapien, quis euismod urna nisl vitae pede. Praesent sagittis.


div.ruleonbottom - adds rule to left side of any HTML element
div.ruleontop - adds rule to left side of any HTML element
div.ruleonleft - adds rule to left side of any HTML element
div.ruleonright - adds rule to left side of any HTML element

div.margins_othercontent ruleontop ruleonbottom - This div is styled with two classes: margins_othercontent to create the margins, ruleontop to put a rule at the top of the div and ruleonbottom to add one at the bottom. Fusce ipsum purus, lobortis nec, blandit blandit, scelerisque vitae, velit. Suspendisse nec orci. Aliquam malesuada tortor nec dui.

p.text_reverse - for text that overlays dark colors



div.boxlabel_beige_dark - Boxlabel style with dark beige background

Ut nonummy, diam vel luctus pulvinar, dolor enim volutpat justo, in blandit leo nisl et nisi. Nunc eget massa. Sed massa urna, scelerisque nec, placerat iaculis, feugiat dictum, magna. Nulla feugiat. Mauris tristique nibh ut velit. Integer congue ipsum nec sem. Suspendisse dapibus gravida risus. Mauris elementum neque quis ante. Morbi sagittis varius magna.

div.boxlabel_beige_light - Boxlabel style with dark beige background

Sed in ligula. Maecenas iaculis, justo vel pellentesque blandit, lectus nunc aliquet sapien, quis euismod urna nisl vitae pede. Praesent sagittis. Donec et risus. Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Morbi odio enim, pulvinar vitae, pretium ut, sodales at, enim. Suspendisse euismod, mauris ac viverra scelerisque, magna lorem aliquam purus.

div.boxlabel_beige_medium - Boxlabel style with dark beige background

Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Vestibulum at turpis. Nunc laoreet ante ut nunc. Aliquam et tortor quis risus molestie tristique. Proin blandit arcu non urna. Duis nunc lectus, lobortis nec, eleifend sit amet, pharetra a, erat. Nam nisl pede, convallis ac, scelerisque eget, porta et, tellus. In leo augue, sagittis sed, cursus.

The following demos an H1 headline trapped within a restricted-size table cell, such as this sliced image table used on SCBE secondary home pages.

h1.nomarginorpadding - trappped

The Stanford Center for Biomedical Ethics is dedicated to interdisciplinary research and  edcuation in biomedical ethics, and provides  clinical and research ethics consultation.  SCBE serves as a scholarly resource on  emerging ethical issues raised by medicine  and biomedical research.

 

 

Stanford Medicine Resources:

Footer Links: