Top-Themen

AppleEntwicklungHardwareInternetLinuxMicrosoftMultimediaNetzwerkeOff TopicSicherheitSonstige SystemeVirtualisierungWeiterbildungZusammenarbeit

Aktuelle Themen (A bis Z)

Administrator.de FeedbackApache ServerAppleAssemblerAudioAusbildungAuslandBackupBasicBatch & ShellBenchmarksBibliotheken & ToolkitsBlogsCloud-DiensteClusterCMSCPU, RAM, MainboardsCSSC und C++DatenbankenDatenschutzDebianDigitiales FernsehenDNSDrucker und ScannerDSL, VDSLE-BooksE-BusinessE-MailEntwicklungErkennung und -AbwehrExchange ServerFestplatten, SSD, RaidFirewallFlatratesGoogle AndroidGrafikGrafikkarten & MonitoreGroupwareHardwareHosting & HousingHTMLHumor (lol)Hyper-VIconsIDE & EditorenInformationsdiensteInstallationInstant MessagingInternetInternet DomäneniOSISDN & AnaloganschlüsseiTunesJavaJavaScriptKiXtartKVMLAN, WAN, WirelessLinuxLinux DesktopLinux NetzwerkLinux ToolsLinux UserverwaltungLizenzierungMac OS XMicrosoftMicrosoft OfficeMikroTik RouterOSMonitoringMultimediaMultimedia & ZubehörNetzwerkeNetzwerkgrundlagenNetzwerkmanagementNetzwerkprotokolleNotebook & ZubehörNovell NetwareOff TopicOpenOffice, LibreOfficeOutlook & MailPapierkorbPascal und DelphiPeripheriegerätePerlPHPPythonRechtliche FragenRedHat, CentOS, FedoraRouter & RoutingSambaSAN, NAS, DASSchriftartenSchulung & TrainingSEOServerServer-HardwareSicherheitSicherheits-ToolsSicherheitsgrundlagenSolarisSonstige SystemeSoziale NetzwerkeSpeicherkartenStudentenjobs & PraktikumSuche ProjektpartnerSuseSwitche und HubsTipps & TricksTK-Netze & GeräteUbuntuUMTS, EDGE & GPRSUtilitiesVB for ApplicationsVerschlüsselung & ZertifikateVideo & StreamingViren und TrojanerVirtualisierungVisual StudioVmwareVoice over IPWebbrowserWebentwicklungWeiterbildungWindows 7Windows 8Windows 10Windows InstallationWindows MobileWindows NetzwerkWindows ServerWindows SystemdateienWindows ToolsWindows UpdateWindows UserverwaltungWindows VistaWindows XPXenserverXMLZusammenarbeit
GELÖST

Skalierbarkeit

Frage Entwicklung CSS

Mitglied: dafdag

dafdag (Level 1) - Jetzt verbinden

09.11.2014 um 17:50 Uhr, 1418 Aufrufe, 4 Kommentare, 1 Danke

Hallo zusammen,

ich bastele gerade an einer Webseite und komme an einem Punkt nicht weiter.

Und zwar habe ich eine Art Box erstellt damit ich den Text vom Hintergrund abheben kann.

Dazu habe ich folgenden Code verwenden:

.box1 {
overflow: hidden;
position: relative;
list-style: none;
padding: 38px 50px 31px;
margin: 0 auto;
border-radius: 15px;
opacity: 0.8;
background: url(../img/patternbox1.png);
width: 550px;
}

Leider ist diese Box nicht skalierbar. Alle andere Inhalte sind skalierbar und gut auf einem Handy zu sehen bis auf die oben genannte Box.

Besten Dank!
Mitglied: wiesi200
09.11.2014, aktualisiert um 18:10 Uhr
Hallo,

kein Wunder wenn du eine feste breite vorgibst.
Da hat er keine Möglichkeit zu skalieren.
Bitte warten ..
Mitglied: dafdag
09.11.2014 um 18:27 Uhr
width: 550px; habe ich rausgenommen leider wird immernoch mobil zu groß angezeigt.
Bitte warten ..
Mitglied: wiesi200
09.11.2014 um 18:36 Uhr
Du könntest jetzt über CSS die Display Größe und gerätetyp abfragen und dann bei Handys die breite entsprechend festlegen.


Am besten währe aber vermutlich wenn du ein bestehendes Framework wie bootstrap verwendest.
Bitte warten ..
Mitglied: colinardo
09.11.2014, aktualisiert um 19:55 Uhr
Hallo dafdag,
dafür gibt es in CSS die Grössenangaben vh und vw (view-height / view-width)
http://www.administrator.de/forum/webseite-zentrieren-241447.html#comme ...

Dein Problem ist aber das du dem Hintergrundbild keine relative Grössenangabe mitgibst damit sich dies mit anpasst.
http://www.w3schools.com/cssref/css3_pr_background-size.asp
Beispiel mit relativen Grössenangaben für das Hintergrundbild
background-size: 100%;
oder
background-size: contain;
http://www.w3schools.com/cssref/playit.asp?filename=playcss_background- ...

Das Padding solltest du dann am besten auch mit relativen Grössenangaben versehen...

Grüße Uwe
Bitte warten ..
Ähnliche Inhalte
Hyper-V
gelöst HyperV Backup (7)

Frage von PharIT zum Thema Hyper-V ...

SAN, NAS, DAS
Software Defined Storage (12)

Frage von Chiacomo zum Thema SAN, NAS, DAS ...

Virtualisierung
gelöst Installation "Kodi" mit Hypervisor Unterbau (4)

Frage von Spirit-of-Eli zum Thema Virtualisierung ...

Neue Wissensbeiträge
Windows 10

Neues Win10 Funktionsupdate verbuggt RemoteApp

Information von thomasreischer zum Thema Windows 10 ...

Microsoft

Die neuen RSAT-Tools für Win10 1709 sind da

(2)

Information von DerWoWusste zum Thema Microsoft ...

Humor (lol)

Wohnt jemand in Belgien und kann nicht mehr ruhig ausschlafen?

(6)

Information von LordGurke zum Thema Humor (lol) ...

Heiß diskutierte Inhalte
Router & Routing
Allnet - VDSL2 Modem - SFP (mini-GBIC) (20)

Frage von Dobby zum Thema Router & Routing ...

Voice over IP
DeutschlandLAN IP Voice Data M Premium, Erfahrung mit Faxgeräte? (17)

Frage von liquidbase zum Thema Voice over IP ...

TK-Netze & Geräte
TK-Anlage VoIP - DECT Erweiterung (16)

Frage von Lynkon zum Thema TK-Netze & Geräte ...