• Post Reply
  • Bookmark Topic Watch Topic
  • New Topic

Code tags on website

 
James Hambrick
Ranch Hand
Posts: 282
Eclipse IDE Firefox Browser Java
  • Mark post as helpful
  • send pies
  • Quote
  • Report post to moderator
I am wanting to style a code tag on my website that works much like most do on forums like this one. Right now I have the yellow background and different font working fine on single line code, but once I try multi-line code I run into problems. For a two line code it shows two yellow boxes that overlap each other. I essentially have to put new lines between them until they line up. There has to be an easier way.

This is what I have on for my code tag in my style.css



You can see a post I have with code tags here

http://randomlyjames.com/2012/06/oracle-10g-new-purge-feature/

I do not have any multi-line examples since they do not look right.
 
Bear Bibeault
Author and ninkuma
Marshal
Pie
Posts: 64715
86
IntelliJ IDE Java jQuery Mac Mac OS X
  • Likes 1
  • Mark post as helpful
  • send pies
  • Quote
  • Report post to moderator
The <code> tag is an inline element, not a block element. Why aren't you using <pre>?
 
James Hambrick
Ranch Hand
Posts: 282
Eclipse IDE Firefox Browser Java
  • Mark post as helpful
  • send pies
  • Quote
  • Report post to moderator
Bear Bibeault wrote:The <code> tag is an inline element, not a block element. Why aren't you using <pre>?


pre as it sits does not put the text inside a box like I want. Should I just change by style.css so it says pre instead of code?
 
Bear Bibeault
Author and ninkuma
Marshal
Pie
Posts: 64715
86
IntelliJ IDE Java jQuery Mac Mac OS X
  • Mark post as helpful
  • send pies
  • Quote
  • Report post to moderator
Give it a try and see if it results in the appearance that you want.
 
James Hambrick
Ranch Hand
Posts: 282
Eclipse IDE Firefox Browser Java
  • Mark post as helpful
  • send pies
  • Quote
  • Report post to moderator
Bear Bibeault wrote:Give it a try and see if it results in the appearance that you want.


I have this in my style.css



Which works as a multi-line code box, but now anything I type after the 'end PRE' ends up beside the 'code box' and not below it. UGH!

 
  • Post Reply
  • Bookmark Topic Watch Topic
  • New Topic