Odd header prob.

DanielB

when i'm signed in, on either side of my header it shows all the gallery links on top of one another...:scratch i'm aware it doesn't show up when looking from a viewers perspective, but it kinda bugs me when i'm logged in and its distracting...

i'll let ya see for yourself, just PM me...


Daniel

Mike Lane

DanielB wrote:

when i'm signed in, on either side of my header it shows all the gallery links on top of one another... i'm aware it doesn't show up when looking from a viewers perspective, but it kinda bugs me when i'm logged in and its distracting...

i'll let ya see for yourself, just PM me...


Daniel

I either need sign in info or a screenshot to help you out.

DanielB

Mike Lane wrote:

I either need sign in info or a screenshot to help you out.

sent ya a PM

Andy

DanielB wrote:

when i'm signed in, on either side of my header it shows all the gallery links on top of one another... i'm aware it doesn't show up when looking from a viewers perspective, but it kinda bugs me when i'm logged in and its distracting...

i'll let ya see for yourself, just PM me...


Daniel

What browser? I'm signed in on your account in FF and it looks fine..

DanielB

Andy wrote:

What browser? I'm signed in on your account in FF and it looks fine..

IE... its the one i have as my sign in, and i use FF as my logged out.

DanielB

doing it when signed out on IE now too....

DanielB

anyone...

ivar

DanielB wrote:

anyone...

#galleriesBox .albumLarge .albumTitle {
[COLOR=Red]position:absolute;[/COLOR]
width:343px;
text-align:center;
[COLOR=Red]top:120px;[/COLOR]
margin:0 auto;
}

Daniel, i think it is this piece of code you have. It is saying the title has an absolute position, 120px from the top.

Try changing the number you'll see what i mean. I don't think you want an absolute postion here though.

Mike Lane

ivar, remember how position:absolute works. If you have position:absolute you will position an element based on the next eldest positioned element (an element with something other than position:static which is the default). So it isn't that position:absolute is inappropriate there, it is that daniel has forgotten a position:relative somewhere in one of the containing elements.

bwg

Mike Lane wrote:

ivar, remember how position:absolute works. If you have position:absolute you will position an element based on the next eldest positioned element (an element with something other than position:static which is the default). So it isn't that position:absolute is inappropriate there, it is that daniel has forgotten a position:relative somewhere in one of the containing elements.

i think something changed with the latest batch of SM updates.

i had some of my absolutely positioned stuff break as well...almost like they took the position: relative off of the .box class.


and now that i think of it, that was just there for IE, and they now branch the code based on the browser soooo that's probably exactly what happened.

ivar

Mike Lane wrote:

ivar, remember how position:absolute works. If you have position:absolute you will position an element based on the next eldest positioned element (an element with something other than position:static which is the default). So it isn't that position:absolute is inappropriate there, it is that daniel has forgotten a position:relative somewhere in one of the containing elements.

Ah, okay. So because the position:relative is missing, it positions the title 120px from the main page in this case? Is that correct?

bwg

ivar wrote:

Ah, okay. So because the position:relative is missing, it positions the title 120px from the main page in this case? Is that correct?

yes.

technically it will position relative to the nearest ancestor with position, but in this case it bubbles all the way up to the body.

ivar

bigwebguy wrote:

yes.

technically it will position relative to the nearest ancestor with position, but in this case it bubbles all the way up to the body.

Cool, got it now, thanks.

Mike Lane

bigwebguy wrote:

i think something changed with the latest batch of SM updates.

i had some of my absolutely positioned stuff break as well...almost like they took the position: relative off of the .box class.


and now that i think of it, that was just there for IE, and they now branch the code based on the browser soooo that's probably exactly what happened.

They branch it? I missed that one. So they serve up CSS dynamically now? Hmm, that's not good when it comes to things that firefox can understand like position:relative.

bwg

Mike Lane wrote:

They branch it? I missed that one. So they serve up CSS dynamically now? Hmm, that's not good when it comes to things that firefox can understand like position:relative.

ok, they took it out because it was causing the huge slowdown in IE when displaying the new helper popups. not related to the code branching (which they now do).

so end result, you gotsta fix your own code.

Daniel, did you ever get fixed up?

DanielB

bigwebguy wrote:

Daniel, did you ever get fixed up?

nope. i'm sittin here running through what you guys just said...

DanielB

bigwebguy wrote:

ok, they took it out because it was causing the huge slowdown in IE when displaying the new helper popups. not related to the code branching (which they now do).

so end result, you gotsta fix your own code.

Daniel, did you ever get fixed up?

i think i figured it out... but how do i do it, so that when it shows a verticle shot the title doesn't cover up the image. but i have it fixed for horizontal...

bwg

DanielB wrote:

i think i figured it out... but how do i do it, so that when it shows a verticle shot the title doesn't cover up the image. but i have it fixed for horizontal...

it's vertical, not verticle. you need to not skip english class.

give me a linky, i'm too lazy to look for it.

DanielB

bigwebguy wrote:

it's vertical, not verticle. you need to not skip english class.

meh.

give me a linky, i'm too lazy to look for it

http://standoutphoto.smugmug.com/Gallery/153628
keep hittin refresh till it shows a vertical image.

i want it to be right under the image, like on my categories.... but it won't comply.

Mike Lane

Fix your CSS first.

• Line: 11 Context : #category #subcategoriesBox .albumTitle Invalid number : text-align none is not a text-align value : none
• Line: 118 Parse error - Unrecognized : //I think this will skip the intermediate step to get to albums. Nope, guess not...// .gallery_1146866 .albumNav {display:none;}
• Line: 238 Context : .dropcap Invalid number : float center is not a float value : center

A proper CSS quote is /* to open it and */ to close it. You cannot use // and //, the rest should be self-explanatory.

DanielB

Mike Lane wrote:

Fix your CSS first.

• Line: 11 Context : #category #subcategoriesBox .albumTitle Invalid number : text-align none is not a text-align value : none
• Line: 118 Parse error - Unrecognized : //I think this will skip the intermediate step to get to albums. Nope, guess not...// .gallery_1146866 .albumNav {display:none;}
• Line: 238 Context : .dropcap Invalid number : float center is not a float value : center

A proper CSS quote is /* to open it and */ to close it. You cannot use // and //, the rest should be self-explanatory.

thanks mike

Mike Lane

DanielB wrote:

thanks mike

Not sure if you fixed it yet or not but this is still in your CSS:

//I think this will skip the intermediate step to get to albums. Nope, guess not...//


That needs to change to this:

/*I think this will skip the intermediate step to get to albums. Nope, guess not...*/

DanielB

Mike Lane wrote:

Not sure if you fixed it yet or not but this is still in your CSS:

//I think this will skip the intermediate step to get to albums. Nope, guess not...//


That needs to change to this:

/*I think this will skip the intermediate step to get to albums. Nope, guess not...*/

just fixed that part.




still tryin to figure out that absolute thing though... like, i understand why it happend... but i'm not sure exactly how to fix it so it stays with my galleries, and doesn't bubble up to the body instead.

Mike Lane

DanielB wrote:

<img src="https://us.v-cdn.net/6029383/emoji/nod.gif&quot; border="0" alt="" > just fixed that part.




still tryin to figure out that absolute thing though...<img src="https://us.v-cdn.net/6029383/emoji/headscratch.gif&quot; border="0" alt="" > like, i understand why it happend... but i'm not sure exactly how to fix it so it stays with my galleries, and doesn't bubble up to the body instead.

A quick tutorial.

There are three ways to position elements: relative, absolute, and static the default. An element is said to be positioned if it has been given a positioning value other than static. The only element that is positioned by default is the body tag which is (in most circumstances) the viewport of the browser.

If an element is nested inside of another element it is said to be a child or a descendent. So for example:

<html>
<body>
<div id="parent">
<div id="child"></div>
</div>
</body>
</html>

The div#child is the child element of div#parent. So if div#parent has the following CSS:

div#parent {
position:relative;
width:100px;
height:100px;
margin:50px auto;
background:lime;
}

Then that will make a lime green 100px by 100px box that is roughly 50px from the top of the browser window. If you then give the following properties to div#child:

div#child {
position:absolute;
top:0;
left:0;
width:50px;
height:50px;
background:blue;
}

you will see that there is a blue box that is in the top left corner of the blue box. If you change div#child to this:

div#child {
position:absolute;
bottom:0;
right:0;
width:50px;
height:50px;
background:blue;
}

you will see that the smaller blue box is now sitting at the bottom right corner of the lime green box. Now if you change the div#parent to the following and leave the div#child as the 2nd version:

div#parent {
/* notice I left out the positioning here */
width:100px;
height:100px;
margin:50px auto;
background:lime;
}


You will see now that the blue box goes to the bottom left hand corner of the browser window.

I'm teaching you (and anyone who reads this and doesn't know) how to fish here. What I'm telling you is to find the parent and child elements and then make sure the parent element is positioned in your CSS.

DanielB

Mike Lane wrote:

A quick tutorial.

There are three ways to position elements: relative, absolute, and static the default. An element is said to be positioned if it has been given a positioning value other than static. The only element that is positioned by default is the body tag which is (in most circumstances) the viewport of the browser.

If an element is nested inside of another element it is said to be a child or a descendent. So for example:

<html>
<body>
<div id="parent">
<div id="child"></div>
</div>
</body>
</html>

The div#child is the child element of div#parent. So if div#parent has the following CSS:

div#parent {
position:relative;
width:100px;
height:100px;
margin:50px auto;
background:lime;
}

Then that will make a lime green 100px by 100px box that is roughly 50px from the top of the browser window. If you then give the following properties to div#child:

div#child {
position:absolute;
top:0;
left:0;
width:50px;
height:50px;
background:blue;
}

you will see that there is a blue box that is in the top left corner of the blue box. If you change div#child to this:

div#child {
position:absolute;
bottom:0;
right:0;
width:50px;
height:50px;
background:blue;
}

you will see that the smaller blue box is now sitting at the bottom right corner of the lime green box. Now if you change the div#parent to the following and leave the div#child as the 2nd version:

div#parent {
/* notice I left out the positioning here */
width:100px;
height:100px;
margin:50px auto;
background:lime;
}


You will see now that the blue box goes to the bottom left hand corner of the browser window.

I'm teaching you (and anyone who reads this and doesn't know) how to fish here. What I'm telling you is to find the parent and child elements and then make sure the parent element is positioned in your CSS.

gonna have to re-read it a couple times but i think i understand, for some reason when i read it i had the voice in my head saying it stiff and very fast.<img src="https://us.v-cdn.net/6029383/emoji/headscratch.gif&quot; border="0" alt="" >





<img src="https://us.v-cdn.net/6029383/emoji/lol3.gif&quot; border="0" alt="" >