Closed. This question does not meet Stack Overflow guidelines. It is not currently accepting answers.
This question appears to be off-topic because it lacks sufficient information to diagnose the problem. Describe your problem in more detail or include a minimal example in the question itself.
Closed 8 years ago.
Improve this question
I am trying to make a search input bar and i dont want the text to go under the img
I want it to automaticly be like this. :0
You can add:
input {text-indent: 20px;}
input {
width: 50%;
padding-left: 50px;
/* Makes it not affect width */
box-sizing:border-box;
-moz-box-sizing:border-box;
-webkit-box-sizing:border-box;
}
This makes it so it doesn't affect with width but still adds padding
Using the text-indent is practically the exact same, you still need the:
Fiddle: text-indent
Fiddle: padding
UPDATE: Fixed Fiddle
Related
Closed. This question does not meet Stack Overflow guidelines. It is not currently accepting answers.
This question appears to be off-topic because it lacks sufficient information to diagnose the problem. Describe your problem in more detail or include a minimal example in the question itself.
Closed 8 years ago.
Improve this question
There is an extra 20 or so pixels on the righthand side of a site I am developing. I've been combing over the CSS and can't seem to find out why.It's not so noticeable when looking at it on a computer unless you scroll over. It is apparent on a mobile devices. You can see a live example here http://gregtregunno.ca
In footer{ in your css, change
padding:10px;
to
padding:10px 0;
It's the padding that's throwing it out.
Line 472 in your CSS.
Because you set the width of the footer to 100% plus gave it padding. Either remove the padding, or add the rule box-sizing: border-box; to the footer rules.
Closed. This question does not meet Stack Overflow guidelines. It is not currently accepting answers.
Questions asking for code must demonstrate a minimal understanding of the problem being solved. Include attempted solutions, why they didn't work, and the expected results. See also: Stack Overflow question checklist
Closed 9 years ago.
Improve this question
I'm using primefaces 3.5. I want my Facelets Header to be Static like Facebook Header.So my content can be scrolled with a fixed header.
Nothing specific to Primefaces or either JSF here. It should simply be a matter of applying the correct css style.
For example:
<style>.header{position: fixed; top: 0;}</style>
<div class="header"></div>
See also:
MDN CSS position reference
I had Same problem in Past. Assign your position to fixed position:fixed and make sure that your z-index value of header is lower than the z-index value of content in css.so that your content will not scroll over the header.
Example:
.header{ position:fixed; z-index:1;}
.content{ position:absolute; z-index:2;}
Closed. This question does not meet Stack Overflow guidelines. It is not currently accepting answers.
Closed 8 years ago.
This question appears to be off-topic because it lacks sufficient information to diagnose the problem. Describe your problem in more detail or include a minimal example in the question itself.
Questions asking for code must demonstrate a minimal understanding of the problem being solved. Include attempted solutions, why they didn't work, and the expected results. See also: Stack Overflow question checklist
Improve this question
The source code is here: http://bit.ly/17T0cps
I'm trying to make the BIG IMPACT text on top of the water splash. When at 100% view they are, but as I zoom out they look like the picture I provided.
Thanks
Just add
display: block;
margin: 0 auto;
to the img.splash.
To center any div use
positon:absolute or postion:relative and then
top:0;
bottom:0;
left:0;
right:0;
margin:auto;
Closed. This question does not meet Stack Overflow guidelines. It is not currently accepting answers.
Questions asking for code must demonstrate a minimal understanding of the problem being solved. Include attempted solutions, why they didn't work, and the expected results. See also: Stack Overflow question checklist
Closed 9 years ago.
Improve this question
I'm trying to send the Highcharts generated graph to the background (so I can overlay a menu item at the top of the page). How can I make this happen?
Relevant CSS:
#chart {
min-width: 400px;
max-width: 1400px;
margin: 0 auto;
z-index: -999 !Important;
}
The problem is you are setting your z-index on the chart div and not it's parent container content:
<div id="content" style="z-index:-1">
Updated fiddle.
Closed. This question does not meet Stack Overflow guidelines. It is not currently accepting answers.
Questions concerning problems with code you've written must describe the specific problem — and include valid code to reproduce it — in the question itself. See SSCCE.org for guidance.
Closed 9 years ago.
Improve this question
I took a WP theme and have customized it for my needs. I have got into a issue now with CSS.
It looks fine on full size
However when resized or when viewed on iPad, the header is getting distorted. As you can see the RSS icon on the top right has gone past the colored header.
Any pointers in this regard would be appreciated.
Please let me know if you need some more information.
In case you need to check with Firebug/other inspector tool, here is my site
If a block overflows, it does not scale the parallel ones. Putting div#header div#menu and div#footer into div#content parallel to the container should solve the issue.
CSS alternative way:
Add floated fixing to the container and all childs, in this case:
#top-overlay, #header, #menu, #content, #footer {
float: left;
min-width: 100%;
}