Vertical Alignment Of Joomla Article Vs Sp Page - Newsberg Template - Question | JoomShaper
Black Friday sale is live with flat 50% OFF. Sale ends soon! Grab your deal now!

Vertical Alignment Of Joomla Article Vs Sp Page - Newsberg Template

JC

Joel C

Template 3 years ago

Using the Newsberg template, I've set #sp-main-body padding to zero (#sp-main-body {padding: 0px 0px;}, which nicely aligns sp pages, and category blog pages vertically just below main menu. However displaying a plain joomla article (e.g., menu item with 'Single Article') results in some excess space between the menu and start of the article. Using browser inspector, there is no padding or margin associated with the displayed article, and seems it is 'placed' at this location, perhaps through some flex type options, and am seeking guidance as to how to get joomla articles to align vertically against main menu, same as was achieved for the sp pages and category blogs.
The div tag immediately before the article content, and the plain joomla article content div tag are shown below.

<div class="article-can-edit d-flex flex-wrap justify-content-between"></div>
<div itemprop="articleBody">this is non marked up text at start of article</div>

Have created simple sp page and joomla article to demonstrate - info in hidden content

0
5 Answers
JC
Joel C
Accepted Answer
3 years ago #59137

Thanks Toufiq. Just want to confirm that the only changes you made were the css additions noted below; am working on several other test sites and I will likely apply change there as well.

.view-article .article-details .newsberg-details-img-wrapper {
    margin-bottom: initial;
}
#sp-header #sp-menu .sp-megamenu-parent > li > a {
    padding: 0px 0px !important;
    margin: 0px 0px !important;
}
.sp-megamenu-wrapper > ul > li{
flex:auto !important;
}
0
Toufiq
Toufiq
Accepted Answer
Senior Staff 3 years ago #58890

Hi there,

Thanks for contacting us. Sorry for the inconvenience. If you need gap top and bottom when you have made the page or article using page builder then you can add padding top and bottom from row settings. Besides, Article view doesn't have option that's why removed padding from there. If you need default padding for top and bottom gap i can add for you. Let me know.

-Thanks

0
JC
Joel C
Accepted Answer
3 years ago #58941

Hi Toufiq, Rather than add padding to the SP Page case, I'm seeking to eliminate the gap that occurs with the article case, and does not occur with the SP Page case. Both cases have all padding and margins eliminated, but the article has a significant gap whereas the SP Page does not, and uncertain why the article is physically placed lower while the SP Page is not, and trying to understand how and why this difference exists which seems to be a result of the Newsbergs template, and what I might be able to do to change the article placement.

0
Toufiq
Toufiq
Accepted Answer
Senior Staff 3 years ago #59026

Please check now and let me know. Thanks

0
Toufiq
Toufiq
Accepted Answer
Senior Staff 3 years ago #59247

If you face the same issue you can apply this css code. Thanks

0