We moved to new unified forum!

Please post all new support queries in our New Forum.

T3 Community Discussion & Support

Let's build the best free Joomla template framework, together!
Subscribe via RSS  Subscribe via email
Recent
Categories
Tags
Users
Badges
View Replies (6)

Resolved Stop using image a small page

0
Votes
Undo
  1. FuzMic
    FuzMic
  2. General Discussion
  3. Saturday, 20 September 2014
  4.  Subscribe via email
Hi friends


In T3 b3 blank template, the responsive layout caters for 4 sizes. In the large size of 1260px, an image 1260px by 120px on the header will fit nice. Once we reduce page size to the smaller layout the image appears in unexpected way.

How can I stop using this image if user use a smaller page size? The image is placed from the Custom.css using .t3-header {background-image: url("../images/pic1260-120.jpg";);}
or better still how to have different jpg for different size?

One more question: What will be the best one size to fit all eg will 600x80 does it.
Comment
There are no comments made yet.
Responses (6)
FuzMic
FuzMic
Accepted Answer Pending Moderation
0
Votes
Undo
Hi guys

Using max-width: 100%, instead of width: 100% does not work.
So let me rephrase my question

As we can see in the "small" responsive layout, the "mainnav" stops display taken over by the offset-canvas side bar. If we apply this, logically speaking, we can just turn off the image at the .header. I can't find the spot to do this. Please help.
Comment
There are no comments made yet.
  1. more than a month ago
  2. General Discussion
  3. # 1
Gardner Luna
Gardner Luna
Hole-in-One The Voice
Accepted Answer Pending Moderation
0
Votes
Undo
Hi FuzMic,

1. To make image responsive, please add class "img-responsive"
2. To disable any element in specific responsive layouts, please refer to the Bootstrap responsive utilities: http://getbootstrap.com/css/#responsive-utilities
If you have any further concern, please let me know.

Gardner.
Comment
There are no comments made yet.
  1. more than a month ago
  2. General Discussion
  3. # 2
FuzMic
FuzMic
Accepted Answer Pending Moderation
0
Votes
Undo
Gardner buddy, you never fail to help. God Bless. Will study. Michael.:D
Comment
There are no comments made yet.
  1. more than a month ago
  2. General Discussion
  3. # 3
Gardner Luna
Gardner Luna
Hole-in-One The Voice
Accepted Answer Pending Moderation
0
Votes
Undo
Thanks for your kind words @FuzMic :)
Comment
There are no comments made yet.
  1. more than a month ago
  2. General Discussion
  3. # 4
FuzMic
FuzMic
Accepted Answer Pending Moderation
0
Votes
Undo
Gardner, to let you know the following modified suggestion from a certain slavelle from JoomlaArt forum works by just adding it in Custom.css

@media (max-width: 1160px) { /* when width less than 1160 from 1260 */
.t3-header {
background-image: linear-gradient(to bottom,#ffffff,#99ff66); /* a linear-gradient image */
}}
Comment
There are no comments made yet.
  1. more than a month ago
  2. General Discussion
  3. # 5
Gardner Luna
Gardner Luna
Hole-in-One The Voice
Accepted Answer Pending Moderation
0
Votes
Undo
Hi FuzMic,

Yeah, customizing in custom.css file an other choice as it's not affected when you upgrade. Great to see it's fixed for you.

Gardner.
Comment
There are no comments made yet.
  1. more than a month ago
  2. General Discussion
  3. # 6
  • Page :
  • 1


There are no replies made for this post yet.
However, you are not allowed to reply to this post.