4 replies [Last post]
AGR567
Offline
newbie
Last seen: 14 years 20 weeks ago
Joined: 2007-01-27
Posts: 2
Points: 0

So, yeah. Im trying to do a website without width-value. Could anyone possibly help me with this? Thanks..

index.html

Horizontal, oh yeah.



THIS TEXT IS SUPPOSED TO BE SHOWN IN ONE LOOONG SENTENCE IN THE BROWSER. IT CANNOT BREAK AT ANY POINT. A SMALLEST WIDTH VALUE SHOULDNT EXIST. WIDTH OF THE WEBSITE SHOULD BE DECIDED BY THE CONTENT. THIS TEXT IS SUPPOSED TO BE SHOWN IN ONE LOOONG SENTENCE IN THE BROWSER. IT CANNOT BREAK AT ANY POINT. A SMALLEST WIDTH VALUE SHOULDNT EXIST. WIDTH OF THE WEBSITE SHOULD BE DECIDED BY THE CONTENT.


style.css
html,body { font: 10px Tahoma; color: #FFFFFF; }
body { margin: 0; padding: 0; background: #000000; }
* { margin: 0; padding: 0; border: none; }
img { margin: 0; padding: 0; border: 0; }
#wrapper { width: auto; margin: 45px 50px; float: left; }
#container { margin: 0; float: left; }

thepineapplehead
thepineapplehead's picture
Offline
Guru
Last seen: 12 weeks 1 day ago
Joined: 2004-06-30
Posts: 9674
Points: 810

So . . . what's the problem

So . . . what's the problem you're having?

Verschwindende wrote:
  • CSS doesn't make pies

AGR567
Offline
newbie
Last seen: 14 years 20 weeks ago
Joined: 2007-01-27
Posts: 2
Points: 0

Nevermind, I got the

Nevermind, I got the solution last night. I forgot to put it up here.

Solution:
#wrapper { width: auto; margin: 45px 50px; white-space: nowrap; }

With white-space: nowrap; the width of the page is decided by the content and never breaks the "line".

Thanks anyway.

thepineapplehead
thepineapplehead's picture
Offline
Guru
Last seen: 12 weeks 1 day ago
Joined: 2004-06-30
Posts: 9674
Points: 810

Any time, glad you got it

Any time, glad you got it sorted.

Out of interest, why do you want a site that stretches like this?

Verschwindende wrote:
  • CSS doesn't make pies

Chris..S
Chris..S's picture
Offline
Moderator
Last seen: 8 years 38 weeks ago
Timezone: GMT+1
Joined: 2005-02-22
Posts: 6078
Points: 173

Actually its not really - at

Actually its not really - at least its not in every other browser besides IE.

For inflow elements width:auto means the element is given the width of its parent minus any horizontal margins, borders & padding. By default, any content that fall outside that width will be drawn where it falls (overflow:visible) which is probably what you are seeing and why you believe the page's width has increased. Put a background on the page and see if the background stays behind your superwide text. The background stops at the limit of the "width".

If you want the page to take on the width of the super wide element you need to take the elements out of flow so that they use "shrink to fit" for their width. To do that float all the important elements in your page.

example/experiment