CSS issue

[bensd]

I am helping a family member with their new website and having an issue with the following:

www. chestnutcaterers .co.uk/new/business-lunches/

If the item description is over two lines then the dashed line appears under the price not running up to it.

Any ideas how to fix this?

 

[martin-s]

The simplest fix might be to put a line-height on the price element

 

[Adam H]

Could put max-width to 100% in the following so that the line follows the end of the block like its suppose to using the pseudo element :

.gk-menu-container dd small {
max-width: 100%;
}

The only trouble with that is it then looks like its an underline on things like the Savoury Croissant description......but imo that looks better than what you currently have.

 

[Adam H]

Scrap that, doing the above messes up things lower down slightly , although you could break those two sections with slightly different max-widths