Jump to content

Weird linebreak


mnvdk

Recommended Posts

I was actually not quite sure where to put this, due to the fact that I have no idea what is causing my problem.

My problem is, as folllows:

I have a menu looking like this:

[code]
echo('<a id="a_omos" href="'.$_SERVER['PHP_SELF'].'?side=omos" target="side">Om os</a>');
[/code]

and it's corresponding style:

[code]
#a_omos
{
  position: absolute;
  left: 400px;
}
[/code]
My problem is, that for some reason, it creates a linebreak between 'Om' and 'os', which is quite annnoying, and I really don't know what could cause this... Anyone experienced anything similar?[table][tr][td][/table]
Link to comment
Share on other sites

Well, I have narrowed it down to the cause of the problem.
Look at this code snippet:
[code]
<html>

<head>

<style type="text/css">

#menu
{
 
}
#a_omos
{
  position: absolute;
  left: 400px;
}

</style>

</head>

<body>

<div id="menu">
<a id="a_omos" href="omos.htm" target="side">Om

os</a>
</div>

</body>

</html>
[/code]

It will output the wanted result. But just by adding a position: absolute; to the #menu style, it will make linebreak whenever there is a whitespace.

Like this
[code]
<html>

<head>

<style type="text/css">

#menu
{
  position: absolute;
}
#a_omos
{
  position: absolute;
  left: 400px;
}

</style>

</head>

<body>

<div id="menu">
<a id="a_omos" href="omos.htm" target="side">Om

os</a>
</div>

</body>

</html>
[/code]

Why is this so? How can it be?
Link to comment
Share on other sites

For some reason the "position: absolute" is causing the <div> to no longer attain it's usual "width: 100%" setting. Thus, the menu div is being squashed to 0% forcing a_omos to undergo word wrap.

Add "div {width: 100%;}" to fix the problem, or a width larger enough to avoid word wrapping. You might have to put it in a class/style if it effects the rest of your page.
Link to comment
Share on other sites

This thread is more than a year old. Please don't revive it unless you have something important to add.

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Restore formatting

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.