Wordpress Themes - WP Forum at BFA

Wordpress Themes - WP Forum at BFA (http://forum.bytesforall.com/index.php)
-   Header configuration & styling (http://forum.bytesforall.com/forumdisplay.php?f=15)
-   -   [SOLVED] Can a minimum width be used for the header when it's position is fixed? (http://forum.bytesforall.com/showthread.php?t=22989)

BertL Jan 4, 2015 02:27 AM

[SOLVED] Can a minimum width be used for the header when it's position is fixed?
 
I am using a minimum width for the layout, which has worked well. Recently I fixed the the position of the header area (including the horizontal page menu) using CSS command "#header {position:fixed;}". This also works beautifully. However, now the minimum width of the layout does not apply to the header area. When the site is compressed so that there are two lines on the menu, it becomes too high and covers part of the text below. Is it possible to somehow set a minimum width for the header area while it's position is still fixed?

juggledad Jan 4, 2015 03:37 AM

could you go to ATO->Export/Import Settings - export your settings and attach them to a response

BertL Jan 4, 2015 03:47 AM

1 Attachment(s)
Okay, here it should come as attached file.

juggledad Jan 5, 2015 06:16 AM

ou could add some CSS targeted to that width to increase the padding you set tor the menus and the center area. Here is an example:
HTML Code:

@media all and (max-width: 520px){
    #left {padding-top: 175px !important;}
    #middle {padding-top: 175px !important;}
    #right-inner {padding-top: 175px !important;}
    #right {padding-top: 175px !important;}
}


BertL Jan 5, 2015 08:27 AM

Didn't work. Maybe I could set a fixed width to avoid the problem?

juggledad Jan 5, 2015 09:30 AM

what's the url, because that CSS worked for me with your settings. Did you put it at the end of the CSS Inserts?

BertL Jan 5, 2015 10:07 AM

Sent you a pm.

juggledad Jan 5, 2015 11:26 AM

I see the effect taking place, but it only happened when the window width it at 520px. Play with that number till it happens when you want. You might even want two sets of CSS for when the menu gets to three lines.

Or maybe I don't understand your problem at all....

BertL Jan 6, 2015 02:25 AM

I did those modifications, but still no effect on my screen (Google Chrome 39.0.2171.95).

My problem is that when you make the window narrower than the chosen Layout MIN width 1015, the header area (logo, title, tagline, page menu etc) continues to contract, so that two and eventually more lines are needed for the page menu, the tagline and so on. The idea with the minimum with on this site is that it should not be possible to make the header area contract beyond the chosen Layout MIN width thus keeping the menu in one line only (and also keeping the header area from covering the text below).

juggledad Jan 6, 2015 08:55 AM

Try this in place of what you used.
HTML Code:

div#header {
    position: fixed;
    width: 99%;
    max-width: 1600px;
    min-width: 1015px;
}


BertL Jan 6, 2015 09:11 AM

Perfect! Thank you very much!


All times are GMT -6. The time now is 07:04 AM.

Powered by vBulletin® Copyright ©2000 - 2020, Jelsoft Enterprises Ltd.