davej Posted May 7, 2013 Share Posted May 7, 2013 Assigning a width to a span seems to have no effect. What if you want a span to occupy a certain width (i.e. push against other elements)? I don't remember how to do this. Thanks Link to comment Share on other sites More sharing options...
newseed Posted May 7, 2013 Share Posted May 7, 2013 If you do NOT have anything (i.e. text, image, etc.) within the span tag then you need to define both width and height. Link to comment Share on other sites More sharing options...
davej Posted May 7, 2013 Author Share Posted May 7, 2013 (edited) Empty or not empty I'm seemingly unable to push anything over with the span with an assigned width. <!DOCTYPE html><html lang="en"><head><style>.ww{width: 500px;height: 60px;}</style></head><body><span class="ww">Some text:</span><input type="text"/></body></html> Edited May 7, 2013 by davej Link to comment Share on other sites More sharing options...
Ingolme Posted May 7, 2013 Share Posted May 7, 2013 Spans are allowed to have horizontal margins and padding. Height, vertical padding and vertical margins don't work, but you can use line-height. Link to comment Share on other sites More sharing options...
davej Posted May 7, 2013 Author Share Posted May 7, 2013 I noticed from the other post that float seems to be one solution... <!DOCTYPE html><html lang="en"><head><style>.ww{width: 100px;height: 60px;float: left;}</style></head><body><span class="ww">Some text:</span><input type="text"/></body></html> Link to comment Share on other sites More sharing options...
Ingolme Posted May 7, 2013 Share Posted May 7, 2013 Float doesn't really do anything, maybe it makes it behave more like a block. If you set the display: to block and then float it will allow width and height to be set. Link to comment Share on other sites More sharing options...
davej Posted May 7, 2013 Author Share Posted May 7, 2013 The width is what is of interest to me. I wanted to try to avoid using a table to align the input fields similar to the situation in the other post. Float seems to be one possible fix. Link to comment Share on other sites More sharing options...
thescientist Posted May 8, 2013 Share Posted May 8, 2013 (edited) the issue is that <span> is an inline element, and doesn't "respond" to width/height styles. In order for it to do so, you could give it span{ display: inline-block; height: 50px; width: 300px;} Edited May 8, 2013 by thescientist Link to comment Share on other sites More sharing options...
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment
Create an account
Sign up for a new account in our community. It's easy!
Register a new accountSign in
Already have an account? Sign in here.
Sign In Now