Public Forums 71,145 posts

[coffeemon Friend coffeemonJoin date: July 2013Posts: 4Downloads:0Uploads:3 Thanks: 2]

#189364

Hello! Is there any way i can remove the margin on the header? A screenshot of my progress so far is attached in this post.
I can’t figure out a way to remove the left and right margin on the side of the header or at least change the colour to #333. I might ruin the whole layout if I play with it some more.

Basically, what I’m trying to do is to fully colour the header #333 and have the red top border go all the way, too. I really need your help. Anyone? 🙁

This is my ideal look (i did it on photoshop):

I’m using Joomla 3.0 and the latest version of T3. Please help!

---

Attachments:

1. 
2. 

[TomC Moderator TomCJoin date: October 2014Posts: 14077Downloads:58Uploads:137 Thanks: 948 Thanked: 3155 times in 2495 posts]

#500775

So that we can try to best assist you, please provide the url of the site you’re working on,
as well as set your site to “Development Mode” within your Template Manager — General settings

[coffeemon Friend coffeemonJoin date: July 2013Posts: 4Downloads:0Uploads:3 Thanks: 2]

#500836

Hello! The site I’m working on is http://todayscarolinian.net/web3.0

I tried matching the header by adding a background image of the body that matches the color of the rest of the header. It’s still a bit problematic though, since this happens in mobile mode:

I think the solution would be to separate the body from the header, but i don’t know how to do it without messing up the whole responsive layout. I reverted it back to its old layout and enabled development mode.

I hope you can help me out! 🙂

---

Attachments:

1. 

[Ninja Lead Moderator Ninja LeadJoin date: November 2014Posts: 16064Downloads:310Uploads:2864 Thanks: 341 Thanked: 3854 times in 3563 posts]

#500856

You can try to use this way

Open templates/t3_blank/css/themes/todays/template.css file

From

.t3-header {
padding-top: 20px;
padding-bottom: 20px;
}

change to

.t3-header {
padding-top: 20px;
padding-bottom: 20px;
margin-right: -20px !important;
margin-left: -20px;
background-color: #222;
width: auto !important;
padding-left: 75px;
}

1 user says Thank You to Ninja Lead for this useful post

1. coffeemon

[coffeemon Friend coffeemonJoin date: July 2013Posts: 4Downloads:0Uploads:3 Thanks: 2]

#500887

Wow! Thank you so much! It works 🙂

[coffeemon Friend coffeemonJoin date: July 2013Posts: 4Downloads:0Uploads:3 Thanks: 2]

#500888

Thanks a lot! 😀

[Author]

Posts