Joomla Templates Club 406,261 posts

[frodojrr Friend frodojrrJoin date: December 2007Posts: 89Downloads:0Uploads:1 Thanks: 16 Thanked: 2 times in 1 posts]

#140917

There is a run-on problem with long headlines running into the PDF/Print/Email logos at the top of articles.

The problem can be seen in the Demo under Travel>Travel Tips in the story, “Semper Sed eros dolor condimentum congue.”

The problem is here on the site I’m building here:

http://www.shireweb.biz/enewsgo/index.php?option=com_content&view=article&id=7280:south-suburban-earth-science-club-april-meeting-features-jewelry-minerals-fossils&catid=88888960&Itemid=88890048

Is there a fix for this?

[frodojrr Friend frodojrrJoin date: December 2007Posts: 89Downloads:0Uploads:1 Thanks: 16 Thanked: 2 times in 1 posts]

#303656

Check here too in order to see the problem:

http://www.shireweb.biz/enewsgo/index.php?option=com_content&view=article&id=7292:two-illinois-youth-honored-for-volunteerism-at-national-award-ceremony-in-washington-dc-&catid=1:latest-local-news&Itemid=88890050

[ccvpguy Friend ccvpguyJoin date: February 2009Posts: 72Downloads:0Uploads:5 Thanks: 29 Thanked: 10 times in 5 posts]

#303665

I have the same problem….

[bandbreed500 Friend bandbreed500Join date: July 2008Posts: 30Downloads:0Uploads:3 Thanks: 2 Thanked: 1 times in 1 posts]

#303759

Can you edit the CSS files? if you open template.css

(can also find this in Joomla admin panel > template manager > edit css)

and look for .buttonheading it should be around line 600 so a bit down. it should look like this:

div.buttonheading {
position: absolute;
top: -25px;
right: 0;
width: 62px;
padding: 3px;
}

if you change the top to, say: -10 the icons should drop a bit, try to get this right so it falls under the text.

BUT: even on lines where it looks nicer next to the text it will drop and if you have an image rigth under your headline, the icons will fall over that image…

I’d suggest rewriting your headlines. A bit of editorial work never hurt anyone.

Good luck.

Edit: clarified the location of the css file.

[frodojrr Friend frodojrrJoin date: December 2007Posts: 89Downloads:0Uploads:1 Thanks: 16 Thanked: 2 times in 1 posts]

#303833

<em>@bandbreed500 127510 wrote:</em><blockquote>Can you edit the CSS files? if you open template.css

(can also find this in Joomla admin panel > template manager > edit css)

and look for .buttonheading it should be around line 600 so a bit down. it should look like this:

div.buttonheading {
position: absolute;
top: -25px;
right: 0;
width: 62px;
padding: 3px;
}

if you change the top to, say: -10 the icons should drop a bit, try to get this right so it falls under the text.

BUT: even on lines where it looks nicer next to the text it will drop and if you have an image rigth under your headline, the icons will fall over that image…

I’d suggest rewriting your headlines. A bit of editorial work never hurt anyone.

Good luck.

Edit: clarified the location of the css file.</blockquote>

Thanks for pointing out the CSS for this. I’ll take a look at it and play around with it. The basic problem is the absolute positioning. I’ll work on turning those into floats. Yet another reason why absolute positioning should be used sparingly.

No, we’re not rewriting headlines. Our journalists and editors don’t serve a Joomla template. This is a news template, and it needs to serve journalists.

1 user says Thank You to frodojrr for this useful post

1. ccvpguy

[frodojrr Friend frodojrrJoin date: December 2007Posts: 89Downloads:0Uploads:1 Thanks: 16 Thanked: 2 times in 1 posts]

#303837

Floating the div instead of using absolute positioning provided the fix. Works just great now.

Change the above references code in the template.css to this:

div.buttonheading {
/*position: absolute;
top: -25px;
right: 0; */
float: left;
width: 62px;
padding: 3px;
}

Take a look again at our long headline and see how nice it looks:

Two Illinois Youth Honored for Volunteerism at National Award Ceremony in Washington, D.C.

[bandbreed500 Friend bandbreed500Join date: July 2008Posts: 30Downloads:0Uploads:3 Thanks: 2 Thanked: 1 times in 1 posts]

#303890

Yeah, floating them seems to do the trick, you can still bump it a bit with margins and such to position it. Also it doesn’t fall over any content you might have.

Good solution.

[Author]

Posts