# kbase.us

## Responsive Image Sizing

For webpages viewed on a larger screen i.e., computer, the maximum width is 800px. 

If image width is greater than 800px

`width="100%” height="auto”`

If width is less than 800px

`max-width="100%” height="auto”`

If width is not 800px or greater, but you want to set a specific maximum size. 

`width="100%” max-width=”NNNpx” height="auto”`

## Add padding to an image

After the size, add the following, specifying side of image and space:

```
style="padding-left: Npx" 
style="padding-right: Npx"
```

## Creating boxes around text

`<p style="border: Npx; border-style:solid; border-color: #HTMLtag; padding: 1em;"> text here </p>`

Teal boxes for developer highlights are 5px and #009688.&#x20;

## Anchors

## Stop text from wrapping around an align left image

\<a id="anchor">\</a>

```
<br clear="left">
```

Add anchor to end of slug for web address

<https://siteaddress/slug/#anchor>

## Embedding and Linking from Drive

1. Open the PDF or image file in a new preview window
2. Open the expanded menu and click on "Embed item..."
   1. To embed an image, select the link or frame.
   2. To link a PDF, copy the Drive link.&#x20;
3. Insert the link in desired location.&#x20;

## Pop up messages

Best practices for using Hustle for messaging on kbase.us

1. Add or edit descriptive Title including dates.
2. Include informative Main Content.&#x20;
3. Add enable the "Never see this message again" link
4. Optional, schedule specific dates, but revert to "Draft" after maintenance period.&#x20;
5. Publish!