Index layout

dominik_kremerskothen / 2013-06-07 17:15:00   

Dear All,

sorry I am really stupid but I would like to customize the layout of the index since I seem to have no contoll of the outcome of how things are spaced in the pre-nav text section nor about the distances between the section titles. Looked with firebug into the matter and tried to find out which part of my documents (css or php files) might control the matter but I could only find a div for the container but not where they are defined. Only from looking at the index on this site I can see that this is done. Sorry question is probably really stupid. Just a newcomer to this world. My site is kredo.me Cheers for you help. Dominik

arsondpi / 2013-06-07 17:31:26   

I'm not really sure that I understand what you want to customize.
Care to elaborate?

dominik_kremerskothen / 2013-06-10 12:03:57   

Yes, sure, sorry to have been so unclear.

At first I would like to customise the index area. Meaning I would like to change the spacing between the various Elements of it. In the pre-nav text I would like to get the "production designer" closer to the "Dominik Kremerskothen" as they are if I have them all the same font and size.
Similar in the pre-nav text I would love to get "Impressum" closer to "build with indexhibit" as well as "kredo.me" and the text with my e-mail address and phone number.
Last but not least, I wonder if I could change the indexpand plug in so that it, once opened, closes when I click on that link again. Sorry. I just wonder where these things are defined and where can I adjust them. Thank you so much and have a nice day. Dominik

arsondpi / 2013-06-10 16:28:48   

To get the heading lines closer together you need to decrease margin-bottom for h2 and h4. The h4 tag is also used in the post-nav area tags...
In order to do this simply edit the style.css file of your theme.

dominik_kremerskothen / 2013-06-10 18:33:25   

Thank you very much for your help. I did it and it was very helpful. However, since I wanted to adjust the margin of the exhibition title I came across the base.css file. In that one I found that I can also adjust the section titles and the exhibition titles sperately which I also wanted to do and it works nicely. However, suddenly the links in the pre nav and in the post nav texts look like some default and the information I added in the post_nav/pre_nav boxes seem to be over written. I cannot find a place in the base.css to adjust that. Do you know where I can fix that? Hrm, sorry. Thanks
Dominik

arsondpi / 2013-06-11 08:13:00   

Dominik there's no need to edit base.css since you can add css selectors to style.css
To "fix" the links issue you need to set a padding bottom and top for your #index links. For example:

  1. #index a:link,
  2. #index a:hover, 
  3. #index a:active, 
  4. #index a:visited {
  5.     padding: 0 1px 0 1px;
  6. }

Last but not least to make things easier for yourself I suggest you download Firefug, a Firefox plugin. Search the web on how to use it. Certainly "saved my day"...
:-)

dominik_kremerskothen / 2013-06-11 11:17:49   

Hey thank you for your help again now I plowed on and did the edit in the base.css but I can revert it of course and back to the style.css.
I already have installed firebug (I assume you mean that since I could not find any firefug ;o) ) but on a lot of issues it always gives me the "kredo.me/ndxzsite/kredos/… (line 6)" or something like that as an answer which than leaves me just in some pre div zone where there is nothing to add and does not tell me where to define things in the style.css sheet. Or at least, with my little knowledge I do not know where to go to define things instead.

On your advice is it possible to have different background colours for the section titles and the exhibits whilst hovering?

Ta in advance. Have a nice one Dominik

dominik_kremerskothen / 2013-06-11 15:09:05   

Hey Arsondpi, thanx for your help with the combination using the various .css files for filling in the respective information I requiered I got it now, more or less ;o). Thanks your additions made me ask the right questions. Thanx so much. Now I am coming to similar issues in the exhibition section. I will dare to ask a question again, if you do not mind but for now I have to go and find the right questions...

Have a nice day.
Dominik

arsondpi / 2013-06-11 15:31:03   

Firebuf (lol) is the perfect tool to get the css id or class of an html element.
Once you get the id/class you can apply any css class you want.

dominik_kremerskothen / 2013-06-11 17:26:09   

Sorry now I am at a loss. It is Firebug not -buf is it? Cannot find the other or am I standing on the hose now? I like Firebug but way to often it only tells me something like "reset.css including base.css and style.css anyway as well by the way (line 1)
Line 1 is than always def (everything) and nothing to add in the end.

Well, you see, I just do not know enough yet. Now for example I am searching for section that defines size and placement of the Text box in 'Format Horizontal'. Info Firebug:
element.style {
float: left;
width: 240px;
}
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video {
border: 0 none;
font: inherit;
margin: 0;
padding: 0;
vertical-align: baseline;
}
Where would I find now this "element.style"? Feeling stupid. All the rest is on my beloved reset.css (line 6) but that does not help. Sorry, but this is how little I understand yet. Cheers.

Dominik
Dominik

arsondpi / 2013-06-11 18:40:21   

It's Firebug (I was trying to make a joke based on my previous honest mistake)

Anyhow.
element style means that the css applied is inline and not in the style.css
Thus you need to find the corresponding css selector for the specific element.
Check this: stackoverflow.com/questions/3770615/…

Dominik I'm gonna close this thread as the initial question has been answered and further confusing questions about other stuff is not going to help future users to find things.

This thread has been closed, thank you.