Semantic code and header tags within DotNetNuke skins
Edit the container for h1 tags
We are now going to create a container to use the h1 tag. If you refer back to the diagram in figure 12, this container will be used to hold the main article content on the page. ie. content in the middle pane.
- Open “image header white background H1” in your editor of choice.
- Edit line 18 and change:
<td valign="middle" width="100%" nowrap> <dnn:TITLE runat="server" id="dnnTITLE" /></td>
to:
<td valign="middle" width="100%" nowrap><h1><dnn:TITLE runat="server" id="dnnTITLE" /></h1></td>
Here we have placed h1 tags around the title of the container.
We have also removed the, “ ” as we demonstrated for the H2 container.
- Open the skin.css file for the DNN-Blue skin
- Change the previous code to:
h1, h2
{
margin: 0;
padding-left: 3px;
}
This groups together the settings for both the h1 and h2 tags.
We have removed all margins from the h1 and h2 tag and we have also added 3px of padding to the left of the h1 and h2 tags.
We have now completed a container which places h1 tags around the title of the container. |  |
|
|