开发者

How do I indent <code> elements? Example in details

开发者 https://www.devze.com 2023-01-28 09:57 出处:网络
http://htmlpocketreference.110mb.com/taggroups.html For the site above, how would I indent all the code. I don\'t want it aligned with the paragraph and headings. I want it to be one indent level in.

http://htmlpocketreference.110mb.com/taggroups.html

For the site above, how would I indent all the code. I don't want it aligned with the paragraph and headings. I want it to be one indent level in.开发者_运维问答 You can check my source if you want and the css is embedded in the html already.

Also, any suggestions on how to improve it?

(Note: I'm not publishing the site, I'm just practicing on getting all the formatting right.


To indent each <code> block, you can use something like:

code{
     display: block;
     margin: 0 40px;
}

To indent only the first line of each <code> block,

code{
     text-indent: 40px;
}

40px is just a suggestion; you can adjust the indentation width to suit your visual needs.


Did you try something like this?

code {
position: relative;
left: 20px;
}


The previous two answers got the methods spot-on:

code
{
  display: block;
  margin-left: 40px;
  font-family: monospace; /* I would add this too, as it makes the code more readable. */
}

Also, as you are displaying code (I hope), try SHJS. Good luck!

0

精彩评论

暂无评论...
验证码 换一张
取 消