Problem with the overflow Options

[Nina-Williams]

I made a layout, but the page doesn't scroll and I don't know where I went wrong. Could you help me?

CODE

<style>div[id="googlebar"],
div div select{
opacity:0;
filter:alpha(opacity=0);
display:none !important;
position:absolute !important;
bottom:2000px !important;}</style>





<div style="position : absolute; left: -10%; margin-left: 100px; top:85px; width:557px; overflow: visible; z-index:1">


<style>

body { background-color: 000000;
background-attachment: fixed; }

</style>

<style>
div div select, div div form, div div input{display:none;filter:alpha(opacity=0);-moz-opacity:0;opacity:0;}
</style>






<img src="link" width="557" height="650" border="0" alt="" usemap="Map" />

</map>





<style>
body {
background-position:no repeat;
background-color:ffffff;
line-height: 10px;
cursor: default;
color:333;
scrollbar-arrow-color:aqua;
scrollbar-face-color: ffffff ;
scrollbar-3dlight-color: ffffff;
scrollbar-darkshadow-color:ffffff;
scrollbar-shadow-color: ffffff;
scrollbar-highlight-color: ffffff;
scrollbar-track-color: ffffff;
}


.profileInfo, .contactTable, .userProfileURL, .interestsAndDetails, .userProfileDetail, .userProfileNetworking, .userProfileSchool,

.userProfileCompany, .extendedNetwork, .latestBlogEntry, .blurbs td.text, .orangetext15, .friendSpace, .friendsComments, table div,

.profile, div div table div ul, div div table div { display:none!important; } div table div, table table div, .clearfix, div div table div div {

display:block!important; }

tant;visibility:hidden}
td td td td{border:0px;width:0px;text-align:left;}
table,td,tr{padding:0px;width:;background-color:transparent}
table table table{padding:1px;height:.01%;width:100%;}
table table,table table table table,table,tr,td{height:0px;!important;border:0px;!important}
a.text,table div font a,table div div,.navbar font,tr td font{visibility:hidden;display:none;height:0px;!important;}
table table table table,table table table table td.text, td.text td.text table{display:none;}
td.text table table{display:inline;visibility:visible;}
table td table tr td.text table{visibility:hidden;}
table td table tr td.text table table,table td table tr td.text table table td.text{visibility:visible;}
img { border:0;}


div.content
{position:absolute;
margin-left:100%;
left:600px;
top:150px;
width:557px;
height:650px;}






</style>
<table><tr><td><table><tr><td><table><tr><td>

[heyo-captain-jac...]

I don't see any code that would prevent scrolling.

Do you have any coding in another section?

Also, your name, a Tekken reference?

[Nina-Williams]

I added this code in order to move the div at the left.

CODE

<div style="position : absolute; left: -10%; margin-left: 100px; top:85px; width:557px; overflow: visible; z-index:1">

When I remove it, the page scrolls, but my div is in wrong direction, that's the problem.


Oh yes, I love Tekken series, how about you?

[Mickey]

Try changing overflow:visible to overflow:auto. Also, change left:10% to left:50% and then fix margin-left:100px to a different number to have it where you want it to be. If that doesn't work, try adding this to your code:

CODE

<style>
body {overflow:auto;}
</style>

[heyo-captain-jac...]

Try adding this:

CODE

<style type="text/css">
body {
overflow: auto !important;
</style>

And the Tekken game was great, but I was never a fan of the movie. It seemed cheesy to me.

[Nina-Williams]

I can't believe it, nothing of those two codes worked.
Only when I remove this the page scrolls again.

CODE

<div style="position : absolute; left: -10%; margin-left: 100px; top:85px; width:557px; overflow: visible; z-index:1">

I had tried also this, but the div was moving, even if the position was absolutely.

CODE

.div {
background:none;
overflow:auto;
position:absolute;
z-index:2;
top:;
left: ;
margin-left: ;
text-align:left;
visibility:visible;}

Any more ideas?


[Ah, I see, I am more of an RPG fan though.]

[heyo-captain-jac...]

CODE

<style type="text/css">
body {
overflow: auto !important;
}
</style>

?

Under most circumstances, MMOs beat all game genres.

[Nina-Williams]

Oh my, nothing again.
Sorry for bugging so much.
Hmm, is there any other code to move the div at the left? Cause when I remove that code, it scrolls again, weird...


[Depends which. Wonderland is full of... I don't wanna say, XDD.]

[heyo-captain-jac...]

Try separating the style from the tag.

CODE

<style type="text/css">
     div.div1 {
          position: absolute;
          left: -10%;
          margin-left: 100px;
          top:85px;
          width:557px;
          overflow: visible;
          z-index:1;}
</style>
<div class="div1">
CRAP GOES HERE
</div>

Pedophiles?

[Nina-Williams]

Worked... But the div is again at that right position and it doesn't get moved.
What a weird layout.


[Loool, 12 years old brats that wanna cyber through messages, XDDD.]

[heyo-captain-jac...]

Maybe you can try a table there instead of a div?



Also, cybering with a 12 year old can get you on Chris Hansen's show.

Edit:

I just noticed that you have no height specified. Is this intentional, or no?

[Nina-Williams]

Hmm, how? I am new into CCS, I need your help again, XDD.

Umm, is the height necessary? Or would you like to send you the whole code?



Chris--who? Never heard of him, XDD.
I wonder if those kids are horny...

[Mickey]

Your codes are messy. Make sure they're all put together. CSS codes should be with other CSS codes, just like HTML codes should be with other HTML codes. You should move all your <style> codes to your Who I'd Like To Meet section and the rest to your About Me section. It should look like this in your About Me:

CODE

<div style="position : absolute; left: -10%; margin-left: 100px; top:85px; width:557px; overflow: auto; z-index:1">

<img src="link" width="557" height="650" border="0" alt="" usemap="Map" />
</map>

</div>

<table><tr><td><table><tr><td><table><tr><td>

And like this in your Who I'd Like To Meet:

CODE

<style>div[id="googlebar"],
div div select{
opacity:0;
filter:alpha(opacity=0);
display:none !important;
position:absolute !important;
bottom:2000px !important;}</style>


<style>

body { background-color: 000000;
background-attachment: fixed; }

</style>

<style>
div div select, div div form, div div input{display:none;filter:alpha(opacity=0);-moz-opacity:0;opacity:0;}
</style>

<style>
body {
background-position:no repeat;
background-color:ffffff;
line-height: 10px;
cursor: default;
color:333;
scrollbar-arrow-color:aqua;
scrollbar-face-color: ffffff;
scrollbar-3dlight-color: ffffff;
scrollbar-darkshadow-color:ffffff;
scrollbar-shadow-color: ffffff;
scrollbar-highlight-color: ffffff;
scrollbar-track-color: ffffff;
}


.profileInfo, .contactTable, .userProfileURL, .interestsAndDetails, .userProfileDetail, .userProfileNetworking, .userProfileSchool,

.userProfileCompany, .extendedNetwork, .latestBlogEntry, .blurbs td.text, .orangetext15, .friendSpace, .friendsComments, table div,

.profile, div div table div ul, div div table div { display:none!important; } div table div, table table div, .clearfix, div div table div div {

display:block!important; }

tant;visibility:hidden}
td td td td{border:0px;width:0px;text-align:left;}
table,td,tr{padding:0px;width:;background-color:transparent}
table table table{padding:1px;height:.01%;width:100%;}
table table,table table table table,table,tr,td{height:0px;!important;border:0px;!important}
a.text,table div font a,table div div,.navbar font,tr td font{visibility:hidden;display:none;height:0px;!important;}
table table table table,table table table table td.text, td.text td.text table{display:none;}
td.text table table{display:inline;visibility:visible;}
table td table tr td.text table{visibility:hidden;}
table td table tr td.text table table,table td table tr td.text table table td.text{visibility:visible;}
img { border:0;}


div.content
{position:absolute;
margin-left:100%;
left:600px;
top:150px;
width:557px;
height:650px;}

</style>

Just saying. And if you want your DIV to move, change left:10% to left:50% and change margin-left:100px; to whatever you need.

[heyo-captain-jac...]

CODE

<style type="text/css">
     table.div1 {
          position: absolute;
          left: -10%;
          margin-left: 100px;
          top:85px;
          width:557px;
          overflow: visible;
          z-index:1;}
</style>
<table class="div1">
CRAP GOES HERE
</div>

I'm not too good with tables, since I never really use them. But I'm pretty sure they work the same way.

A height property isn't nessicarry, without it everything usually just wraps around the content.

Also, Chris Hansen is the guy from To catch a predator.

Edit:

I haven't slept in two days, so I'm going to go to sleep now. If you still need help, this topic stays open, and I know for a fact that plenty of people here would be willing to help.

[Nina-Williams]

Oh well, you see I have write through Photoshop the info, so I do not need a table.
Hmm, I think I should provide the whole code to try it yourself.

CODE

<style>
body {
overflow: auto !important;
</style>

<style>div[id="googlebar"],
div div select{
opacity:0;
filter:alpha(opacity=0);
display:none !important;
position:absolute !important;
bottom:2000px !important;}</style>

<style>
div div select, div div form, div div input{display:none;filter:alpha(opacity=0);-moz-opacity:0;opacity:0;}
</style>



<style>
div.div1 {
position: absolute;
left: 10%;
margin-left: 360px;
top:120px;
width:557px;
overflow: visible;
z-index:1;
}
</style>

<img src="http://i37.tinypic.com/osbu48.jpg" width="557" height="650" border="0" alt="" usemap="#minervalayout1_Map" />
<map name="minervalayout1_Map">
<area shape="rect" alt="" coords="386,422,518,462" href="http://www.msplinks.com/MDFodHRwOi8vaG9tZS5teXNwYWNlLmNvbS9pbmRleC5jZm0/ZnVzZWFjdGlvbj11c2Vy" />
<area shape="rect" alt="" coords="353,363,518,416" href="http://www.msplinks.com/MDFodHRwOi8vYmxvZy5teXNwYWNlLmNvbS9pbmRleC5jZm0/ZnVzZWFjdGlvbj1ibG9nLkxpc3RBbGwmZnJpZW5kSUQ9MTAwMDc0MDY3Mg==" />
<area shape="rect" alt="" coords="391,304,524,355" href="http://www.msplinks.com/MDFodHRwOi8vbWVzc2FnaW5nLm15c3BhY2UuY29tL2luZGV4LmNmbT9mdXNlYWN0aW9uPW1haWwubWVz
2FnZSZmcmllbmRJRD0xMDAwNzQwNjcyJk15VG9rZW49ZjJjZTc0ZWEtNzBkYy00NzQ4LWIxNjUtODBjM
IyNmYxNWQ2" />
<area shape="rect" alt="" coords="398,244,532,294" href="http://www.msplinks.com/MDFodHRwOi8vY29tbWVudC5teXNwYWNlLmNvbS9pbmRleC5jZm0/ZnVzZWFjdGlvbj11c2VyLnZpZXdQcm9maWxlX2NvbW1lbnRGb3JtJmZyaWVuZElEPTEwMDA3NDA2NzIm
XlUb2tlbj1lYmRkYWUyNC03YjQ0LTQ2MTUtYjlkZC1mN2NmZWNmZTJmZDI=" />
</map>




<style>
body {
background-position:no repeat;
background-color:ffffff;
line-height: 10px;
cursor: default;
color:333;
scrollbar-arrow-color:aqua;
scrollbar-face-color: ffffff ;
scrollbar-3dlight-color: ffffff;
scrollbar-darkshadow-color:ffffff;
scrollbar-shadow-color: ffffff;
scrollbar-highlight-color: ffffff;
scrollbar-track-color: ffffff;
}


.profileInfo, .contactTable, .userProfileURL, .interestsAndDetails, .userProfileDetail, .userProfileNetworking, .userProfileSchool,

.userProfileCompany, .extendedNetwork, .latestBlogEntry, .blurbs td.text, .orangetext15, .friendSpace, .friendsComments, table div,

.profile, div div table div ul, div div table div { display:none!important; } div table div, table table div, .clearfix, div div table div div {

display:block!important; }

tant;visibility:hidden}
td td td td{border:0px;width:0px;text-align:left;}
table,td,tr{padding:0px;width:;background-color:transparent}
table table table{padding:1px;height:.01%;width:100%;}
table table,table table table table,table,tr,td{height:0px;!important;border:0px;!important}
a.text,table div font a,table div div,.navbar font,tr td font{visibility:hidden;display:none;height:0px;!important;}
table table table table,table table table table td.text, td.text td.text table{display:none;}
td.text table table{display:inline;visibility:visible;}
table td table tr td.text table{visibility:hidden;}
table td table tr td.text table table,table td table tr td.text table table td.text{visibility:visible;}
img { border:0;}


div.content
{position:absolute;
margin-left:-400;
top:150px;
width:557px;
height:650px;}






</style>
<table><tr><td><table><tr><td><table><tr><td>

Oh, I didn't knew. Some kind of American show eh?


Sure, good night and thanks. <3

This post has been edited by Nina-Williams: Jul 25 2008, 03:40 AM

[Mickey]

Do you mind posting the link to your MySpace page?

[Nina-Williams]

It is private well, and I wouldn't like...
I posted the code, isn't that enough?

[Nina-Williams]

Umm... it is only on the about me.
Cause I wrote the info through the Photoshop, so i didn't need a scrollbox inside.
That's why the who'd like to meet is empty.
But yes, the problem is with the position of the div.

[Nina-Williams]

Well...
I had added this:

CODE

<div style="position : absolute; left: -10%; margin-left: 100px; top:85px; width:557px; overflow: visible; z-index:1">

But when I add it, it disables my scroll page.

[Nina-Williams]

Okay, here.

http://i33.tinypic.com/168ad6a.jpg


The current location and where I want it.


I did what you said and the layout went too right and only the half can be seen.
Damn.

[Mickey]

Okay, that's good enough. Here, add the bold text to what you already have:

CODE

<div class="div1" style="overflow-x:hidden; overflow-y:auto;">

<img src="http://i37.tinypic.com/osbu48.jpg" width="557" height="650" border="0" alt="" usemap="#minervalayout1_Map" />
<map name="minervalayout1_Map">
<area shape="rect" alt="" coords="386,422,518,462" href="http://www.msplinks.com/MDFodHRwOi8vaG9tZS5teXNwYWNlLmNvbS9pbmRleC5jZm0/ZnVzZWFjdGlvbj11c2Vy" />
<area shape="rect" alt="" coords="353,363,518,416" href="http://www.msplinks.com/MDFodHRwOi8vYmxvZy5teXNwYWNlLmNvbS9pbmRleC5jZm0/ZnVzZWFjdGlvbj1ibG9nLkxpc3RBbGwmZnJpZW5kSUQ9MTAwMDc0MDY3Mg==" />
<area shape="rect" alt="" coords="391,304,524,355" href="http://www.msplinks.com/MDFodHRwOi8vbWVzc2FnaW5nLm15c3BhY2UuY29tL2luZGV4LmNmbT9mdXNlYWN0aW9uPW1haWwubWVz
2FnZSZmcmllbmRJRD0xMDAwNzQwNjcyJk15VG9rZW49ZjJjZTc0ZWEtNzBkYy00NzQ4LWIxNjUtODBjM
IyNmYxNWQ2" />
<area shape="rect" alt="" coords="398,244,532,294" href="http://www.msplinks.com/MDFodHRwOi8vY29tbWVudC5teXNwYWNlLmNvbS9pbmRleC5jZm0/ZnVzZWFjdGlvbj11c2VyLnZpZXdQcm9maWxlX2NvbW1lbnRGb3JtJmZyaWVuZElEPTEwMDA3NDA2NzIm
XlUb2tlbj1lYmRkYWUyNC03YjQ0LTQ2MTUtYjlkZC1mN2NmZWNmZTJmZDI=" />
</map>

</div>

And change margin-left:369px; (or whatever number you have on it right now) to margin-left:-279px;. See if that does anything.

[Nina-Williams]

CODE

<div class="div1" style=" left: -10%; margin-left: 100px; top:85px; overflow-x:hidden; overflow-y:auto; left: -50%; margin-left: 279px; top:85px; ">

Such as that? Cause it scrolls, but the location is the same...
Yes, so much bugging, it never happened before. ><

[Jghelfi]

Try Taking OFF the OVERFLOW in the CODE..

[manny-the-dino]

Due to this topic being 2 weeks old & the problem being solved, this topic is Closed & Moved. PM me if you'd like for me to open this.